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页面输出就可以了

到此这篇关于php+js实现点赞功能的示例的文章就介绍到这了,更多相关php+js实现点赞功能内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

时间: 2020-08-04

php+jQuery+Ajax实现点赞效果的方法(附源码下载)

本文实例讲述了php+jQuery+Ajax实现点赞效果的方法.分享给大家供大家参考,具体如下: 数据库设计 先准备两张表,pic表保存的是图片信息,包括图片对应的名称.路径以及图片"赞"总数,pic_ip则记录用户点击赞后的IP数据. CREATE TABLE IF NOT EXISTS `pic` ( `id` int(11) NOT NULL AUTO_INCREMENT, `pic_name` varchar(60) NOT NULL, `pic_url` varchar(60

php+mysql+ajax 局部刷新点赞/取消点赞功能(每个账号只点赞一次)

记录每个赞的点赞用户,以及对赞的数量统计 首先判断用户是否点赞.根据是否点赞,载入不同的html,调用不同的方法 已点赞 如果已点赞,显示已点赞的html,进行取消点赞操作 未点赞 如果未点赞,显示未点赞的html,进行点赞操作 对于不同操作,对数据库进行增加或减少操作.同时对于不同用户的点赞,进行增加记录或删除记录操作.通过控制不同按钮的背景,来显示不同的效果.通过记录不同用户的用户id和赞的id之间的关系,进行不同点赞的限制. 效果演示 当用户id为1时,进行点赞,点赞数加1 更改用户id,

Ajax实现phpcms 点赞功能实例代码

首先 是将后台中 模块--->新闻心情--->心情配置  去掉多余的剩一个,名称改成 "赞" 提交保存. 其次 是修改新闻心情的模板文件:/phpcms/templates/default/mood/index.html 删除所有代码只返回点赞总数量 {loop $setting $k $v} {$data[$v['fields']]} {/loop} 模板页面的实现如下  通过循环数组 <div class="info"> <a hr

PHP+fiddler抓包采集微信文章阅读数点赞数的思路详解

简介: 分析接口知道要获取文章阅读数和点赞数必须有key和uin这两个关键参数,不同公众号key不一样(据说有万能微信key,不懂怎么搞到),同一个公众号key大概半小时会过期 提交链接获取文章阅读量api 思路: 1.将客户端请求阅读量接口的请求拦截转发到自己服务器,这样就可以获取到key ,用__biz关联缓存半小时 2.提交文章链接进行查询时,服务器从文章链接里获取__biz,查询是否缓存了当前公众号对应的key,有的话进行第3步,没有进行第4步. 3.curl请求https://mp.w

php+mysql结合Ajax实现点赞功能完整实例

本文实例讲述了php+mysql结合Ajax实现点赞功能的方法.分享给大家供大家参考.具体如下: 要实现点赞功能,有多种实现方式,这里总结一下利用Ajax,php和mysql来实现点赞的数据的功能.具体步骤如下: 一.页面中的HTML代码部分: <span>0</span> <button onclick="goodplus(1);">good+1</button> <span>0</span> <butto

php+xml结合Ajax实现点赞功能完整实例

本文实例讲述了php+xml结合Ajax实现点赞功能的方法.分享给大家供大家参考.具体如下: 使用xml.php和Ajax实现点赞功能,不需要链接数据库,使用php来修改xml的内容,使用Ajax直接或许xml的内容. 一.准备好xml: <?xml version="1.0"?> <goodtree> <goodnode> <id>0</id> <count>17</count> </goodn

基于Django框架利用Ajax实现点赞功能实例代码

概要: 要实现点赞功能,需要实现的有:谁进行的点赞.什么时候进行点赞.点赞的对象是谁.每一个对象的点赞数量是多少.点赞过后还需要能够取消点赞,为了是点赞后的信息能够及时的显示在前端页面,就需要使用Ajax来异步请求数据,实现实时显示. 下面话不多说了,来随着小编一起看看详细的介绍吧 模型分析: 创建的模型需要记录的数据有:点赞者.点赞对象.点赞时间.点赞的数量,由于前面三个属性主要用于记录点赞的状态,而点赞数量主要用于记录某篇文章的点赞数量,所以这里最好把点赞数量单独放在一个模型中.这里就创建了

js实现的在线调色板功能完整实例

本文实例讲述了js实现的在线调色板功能.分享给大家供大家参考,具体如下: 运行效果图如下: 完整实例代码如下: <html> <head> <meta http-equiv="content-Type" content="text/html;charset=utf-8"> <meta name="keywords" content="调色板" /> <meta name=&

jQuery实现的简单悬浮层功能完整实例

本文实例讲述了jQuery实现的简单悬浮层功能.分享给大家供大家参考,具体如下: 运行效果图如下: 具体代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml

Python设计实现的计算器功能完整实例

本文实例讲述了Python设计实现的计算器功能.分享给大家供大家参考,具体如下: 通过利用PYTHON 设计处理计算器的功能如: 1 - 2 * ( (60-30 +(-40/5) * (9-2*5/3 + 7 /3*99/4*2998 +10 * 568/14 ))- (-4*3)/(16-3*2)) 我的处理计算基本思路是: 解题思路是,需要优先处理内层括号运算--外层括号运算--先乘除后加减的原则: 1.正则处理用户输入的字符串,然后对其进行判断,判断计算公式是否有括号,有就先将计算公式进

Jquery动态列功能完整实例

本文实例讲述了Jquery动态列功能.分享给大家供大家参考,具体如下: 看到有人写的一个JQUERY动态列, 值得参考, 特转发下来 <!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <style> body { margin: 50px 100px; } #

AngularJS使用拦截器实现的loading功能完整实例

本文实例讲述了AngularJS使用拦截器实现的loading功能.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html lang="zh-CN" ng-app="myApp"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge

AngularJS自定义指令实现面包屑功能完整实例

本文实例讲述了AngularJS自定义指令实现面包屑功能.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html lang="zh-CN" ng-app="myApp"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"

JS实现的简单表单验证功能完整实例

本文实例讲述了JS实现的简单表单验证功能.分享给大家供大家参考,具体如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head&