php+js实现点赞功能的示例详解

最近在做一个视频网站，需要实现视频的点赞功能，我是结合ajax和数据库实现的，数据库的格式为有四个字段：文章id,赞，踩，ip。因为需要一个ip只能点赞一次，所以需要一个ip字段存储点赞的ip,这样便于判断该ip是否已经点赞过了；

我将点赞和踩的图片做成两个按钮；具体代码如下：

<button style=\"margin-left:4px\" id=\"vote\" rel=\"<?php echo 文章id;?>\">
<img src=\"点赞图片路径\" alt=\"赞\">
<span style=\"position:absolute;margin-top:6px;margin-left:2px;font-size:20px\">
<span style=\"position:absolute;margin-top:-2px;margin-left:6px;font-size:20px\">
<?php if(!$vnum){echo 0;}else{ echo 点赞次数;} ?>
</span>
</button>

<button style=\"margin-left:38px;margin-top:1px;position:absolute\" id=\"dvote\" rel=\"<?php echo 文章id;?>\">
<img src=\"踩图片路径\" alt=\"踩\" >
<span style=\"position:absolute;margin-top:2px;margin-left:6px;font-size:20px\">
<?php if(!$dnum){echo 0;}else{ echo 踩次数;} ?>
</span>
</button>

js程序

<script type=\"text/javascript\">
$(function(){
var id=$(\"#vote\").attr(\'rel\');//获取到文章id;
$(\"#vote\").click(function(){
$.get(\"传到哪个页面?id=\"+id,function(r){
alert(r);
window.location.reload();//点赞成功后刷新页面更新新的点赞次数
})
})

$(\"#dvote\").click(function(){
$.get(\"/news/dvote?id=\"+id,function(r){
alert(r);
window.location.reload();
})
})
})

</script>

我是用ci框架写，所以在news.php下面的vote方法和dvote方法代表的是赞和踩，具体代码如下

public function vote(){
$id=$_GET[\'id\'];
$ip=getIP();
$getdata=$this->data_model;
$data=$getdata->get_vote_ip($id,$ip);
$msg=\"\";
if(empty($data[\'ip\']) || !$data[\'ip\']){
　　$data=array(\'nid\'=>$id,\'vote\'=>1,\'ip\'=>$ip);
　　$re=$getdata->insert_vote($data);
　　$msg.=\"点赞成功\";
}else{
　　$msg.=\"一个ip只能操作一次\";
}
echo $msg;
}

public function dvote(){
$id=$_GET[\'id\'];
$ip=getIP();
$getdata=$this->data_model;
$data=$getdata->get_vote_ip($id,$ip);

//get_vote_ip($id,$ip),是在模型里面的查询该ip是否已经点赞过，具体代码 如下

//public function get_vote_ip($id,$ip){

// $query=$this->db->query(\"select * from 表名 where nid=\'{$id}\' and ip=\'{$ip}\'\");
// $data=$query->result_array()[0];

// return $data;
// }


$msg=\"\";
if(empty($data[\'ip\']) || !$data[\'ip\']){
　　$data=array(\'nid\'=>$id,\'dvote\'=>0,\'ip\'=>$ip);
　　$re=$getdata->insert_vote($data);
　　$msg.=\"踩成功\";
}else{
　　$msg.=\"一个ip只能操作一次\";
}
echo $msg;
}

点赞可以实现以后，就是需要将点赞数据进行更新，首先需要在数据库查询该篇文章所以的点赞信息

//获取点赞信息
public function get_vote($id){
$query=$this->db->query(\"select * from tx_vote where nid=\'{$id}\'\");
$data=$query->result_array();
return $data;
}

获取信息返回到 控制器里面将赞和踩的信息循环分别存入到数据库中然后分别计算新的数组长度就可以获取赞和踩的次数了，这样的再html页面输出就可以了