网站点赞见得很多了吧，wordpress也有文章点赞，这里我不针对wordpress而是针对普通的php网站。最近无聊在做一个小论坛程序集成在ACG Balrogs上面。想到了每次发帖新增一个点赞功能。
上图是我正在建设的一个讨论小版块，别看布局样式了，我正在努力修改呢...
点赞后的效果：
上图的大拇指是font字体，并不是图片
ajax点赞的基本原理就是，用cookie判断用户是否已经点赞，如果没有设置cookie那么就让数据库中点赞的字段加1，,如果已经点赞了那么就提示他已经点赞。原理很简单。接下来我用代码来演示。
首先建立3个php文件,分别为：
1.php(用户点赞页面)
2.php(点赞后台)
3.php(数据库连接)
将3.php都导入到1和2文件中
1.php:
<?php require_once '3.php';//引入数据库连接 ?>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>AJAX点赞</title>
</head>
<body>
<script>
//这里ajax传递如果不清楚的话可以去 https://www.balrogsxt.com/162.html 去看看 这里就不多说了
var x = new XMLHttpRequest();
function a(){
x.open("POST","2.php");
x.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
x.send("good=true");
x.onreadystatechange = function(){
if(x.readyState==4){
if(x.status==200){
document.getElementById("good").innerHTML=x.responseText;
}
}
}
}
</script>
<button onclick="a();" id="good">
<?php
//判断cookie是否设置，如果设置输出已赞，如果没有输出赞一个
if(isset($_COOKIE['good'])){
echo "已赞";
}else{
echo "赞一个";
}?>
</button>
</body>
</html>
2.php:
<?php
require_once '3.php';//引入数据库连接
if(@$_POST['good']){//1.php文件触发ajax传输后
if(isset($_COOKIE["good"])){//判断是否设置cookie
echo "已赞过...";//如果设置，则返回已赞过
}else{//否则
//先查询数据库找到记录点赞次数的字段
$query = mysql_query("SELECT * FROM good WHERE good_id = 1");
//返回query的数组信息
$good = mysql_fetch_array($query);
//自增1 也可以用 $good['good_num']+=1
$num = $good['good_num']+1;
//修改
if(mysql_query("UPDATE good good SET good_num = $num WHERE `good`.`good_id` = 1;")){
//输出已赞
echo "已赞($num)";
//创建cookie good 设置时间为当前时间+72000000毫秒，约为3年左右吧....
setcookie("good",true,time()+72000000);
}else{
echo "出错了...";
}
}
}
?>
3.php:
<?php//这个连接数据库不多说
$link = mysql_connect("localhost","root","123")or die("连接数据库失败");
mysql_select_db("good",$link);
?>
数据表：
CREATE TABLE IF NOT EXISTS `good` ( `good_id` bigint(20) unsigned NOT NULL AUTO_INCREMENT, `good_num` int(20) NOT NULL DEFAULT '0', PRIMARY KEY (`good_id`) ) ENGINE=MyISAM DEFAULT CHARSET=utf8 AUTO_INCREMENT=2 ; INSERT INTO `good` (`good_id`, `good_num`) VALUES (1, 0);
点赞就到此结束了，希望大家能够理解，我得赶快去做我的小论坛咯……
4条评论登录后可见
