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


Posted in PHP onJuly 24, 2020

记录每个赞的点赞用户,以及对赞的数量统计
首先判断用户是否点赞。根据是否点赞,载入不同的html,调用不同的方法

已点赞

如果已点赞,显示已点赞的html,进行取消点赞操作

未点赞

如果未点赞,显示未点赞的html,进行点赞操作

对于不同操作,对数据库进行增加或减少操作。同时对于不同用户的点赞,进行增加记录或删除记录操作。通过控制不同按钮的背景,来显示不同的效果。通过记录不同用户的用户id和赞的id之间的关系,进行不同点赞的限制。

效果演示

当用户id为1时,进行点赞,点赞数加1

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

更改用户id,当id为2时,用户1的用户已进行了点赞,点赞数在用户1点赞基础上增加1

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

数据库

数据库,分为两个数据表。一个进行对点赞数的统计,一个进行不同用户的点赞记录。

两个数据表的详细信息

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

连接数据库

$con = new mysqli('localhost','root','','test');
	if (!$con)
	{
	 die('连接数据库失败,失败原因:' . mysqli_error());
	}else {
	 // echo "连接成功";
	}

对用户是否点赞进行判断(操作页面)

对数据库的信息进行提取

//假设用户编号为1
	$uId="1";
	
	//假设赞编号为1
	$zanId="1";
	
	//查找赞id为1的点赞数
	$count=mysqli_query($con, "SELECT count FROM zanCount WHERE zanId=$zanId ");
	$countResult=mysqli_fetch_array($count);
	$countZan=$countResult['count'];
	
	//查找改用户是否对赞id为1 点赞
	$uIdLike=mysqli_query($con, "SELECT * FROM zanRecord WHERE uId=$uId ");
	$result=mysqli_fetch_array($uIdLike);

对用户是否点赞进行判断,并输出不同的html

//点赞
if (isset($result)) 
	{
	 $showZan.=<<<html
  <div class="dolikeDIV" id="dolikeDIV">
		 <button id="dolike" οnclick="zanDel()"></button>
		 <span id="zan">$countZan</span>
  </div>
html;
	 
	 
	}
	//没点赞
	else
	{
	 $showZan.=<<<html
 <div class="dolikeDIV" id="dolikeDIV">
		 <button id="donolike" οnclick="zan()"></button>
		 <span id="zan">$countZan</span>
 </div>
html;
	}
	echo $showZan;
 ?>

css样式

#dolike, #donolike 
{ 
 width:30px;
 height:30px; 
 margin-left:20px;
 float:left;}
#donolike 
{
background:url(./images/nolike.png); 
background-size:30px 30px; 
}
#dolike
{
background:url(./images/like.png);
 background-size:30px 30px; 
 }

调用的ajax方法

传递需要的数据,这里传递的时zanId 和uId
记得引入jq文件
点赞

function zan()
{
	$.ajax({
		type:"POST",
		url:"./likeSever.php",
		data:{'zanId':$("#zanId").val(),'uId':$("#uId").val()},
		success:function(text){
			$("#dolikeDIV").html(text);
		}
	});
	
}

取消点赞

function zanDel()
{
	$.ajax({
		type:"POST",
		url:"./disSever.php",
		data:{'zanId':$("#zanId").val(),'uId':$("#uId").val()},
		success:function(text){
			$("#dolikeDIV").html(text);
		}
	});
	
}

处理代码

点赞处理

//更新赞总数的数据
 mysqli_query($con,"UPDATE zanCount SET count = count+1 WHERE zanId=$zanId");
 
 //添加一条点赞记录 
 mysqli_query($con,"INSERT INTO zanRecord(zanId,uId) VALUES($zanId, $uId); ");
 
 //查找赞的总数
 @$count=mysqli_query($con, "SELECT count FROM zanCount WHERE zanId=$zanId ");
 @$countResult=mysqli_fetch_array($count);
 @$countZan=$countResult['count'];
 
 //更改输出的html
 $show="";
 $show=<<<html
 <button id="dolike" οnclick="zanDel()"></button>
		<span id="zan">$countZan</span>
html;
 echo $show;

取消点赞处理

//更新赞总数的数据
 mysqli_query($con,"UPDATE zanCount SET count = count-1 WHERE zanId=$zanId");
 
 //添加一条点赞记录
 mysqli_query($con,"DELETE FROM zanRecord WHERE zanId=$zanId AND uId=$uId ");
 
 //查找赞的总数
 @$count=mysqli_query($con, "SELECT count FROM zanCount WHERE zanId=$zanId ");
 @$countResult=mysqli_fetch_array($count);
 @$countZan=$countResult['count'];
 
 //更新html
 $show="";
 $show.=<<<html
 <button id="donolike" οnclick="zan()"></button>
		<span id="zan">$countZan</span>
html;

点赞的图片
图片自己画的,有点不太美观

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

到此这篇关于php+mysql+ajax 局部刷新点赞/取消点赞功能(每个账号只点赞一次)的文章就介绍到这了,更多相关php+mysql+ajax 局部刷新点赞内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

PHP 相关文章推荐
PHP遍历数组的几种方法
Mar 22 PHP
PHP 之Section与Cookie使用总结
Sep 14 PHP
PHP登录环节防止sql注入的方法浅析
Jun 30 PHP
php实现监控varnish缓存服务器的状态
Dec 30 PHP
PHP获取数组最后一个值的2种方法
Jan 21 PHP
php可应用于面包屑导航的迭代寻找家谱树实现方法
Feb 02 PHP
PHP通过API获取手机号码归属地
May 28 PHP
php超快高效率统计大文件行数
Jul 05 PHP
纯php生成随机密码
Oct 30 PHP
PHP基于yii框架实现生成ICO图标
Nov 13 PHP
PHP递归实现层级树状展开
Apr 01 PHP
php实现socket推送技术的示例
Dec 20 PHP
php实现商城购物车的思路和源码分析
Jul 23 #PHP
PHP安全之register_globals的on和off的区别
Jul 23 #PHP
PHP代码覆盖率统计详解
Jul 22 #PHP
php实现统计IP数及在线人数的示例代码
Jul 22 #PHP
Yii使用DbTarget实现日志功能的示例代码
Jul 21 #PHP
浅谈PHP之ThinkPHP框架使用详解
Jul 21 #PHP
浅谈php常用的7大框架的优缺点
Jul 20 #PHP
You might like
强烈推荐:php.ini中文版(1)
2006/10/09 PHP
PHP 实现多服务器共享 SESSION 数据
2009/08/15 PHP
php 正则表达式小结
2009/08/31 PHP
php生成静态页面的简单示例
2014/04/17 PHP
php实现paypal 授权登录
2015/05/28 PHP
PHP下SSL加密解密、验证、签名方法(很简单)
2020/06/28 PHP
Jquery绑定事件(bind和live的区别介绍)
2013/08/23 Javascript
JavaScript中的字符串操作详解
2013/11/12 Javascript
js showModalDialog参数的使用详解
2014/01/07 Javascript
浅析jquery ajax异步调用方法中不能给全局变量赋值的原因及解决方法
2014/01/10 Javascript
js事件绑定快捷键以ctrl+k为例
2014/09/30 Javascript
jquery中filter方法用法实例分析
2015/02/06 Javascript
JavaScript判断FileUpload控件上传文件类型
2015/09/28 Javascript
jQuery进行组件开发完整实例
2015/12/15 Javascript
node.js 中国天气预报 简单实现
2016/06/06 Javascript
原生js实现回复评论功能
2017/01/18 Javascript
angularJS深拷贝详解
2017/03/23 Javascript
node中的session的具体使用
2018/09/14 Javascript
Vue作用域插槽实现方法及作用详解
2020/07/08 Javascript
python实现淘宝购物系统
2019/10/25 Python
Python面向对象封装操作案例详解 II
2020/01/02 Python
在Pytorch中计算卷积方法的区别详解(conv2d的区别)
2020/01/03 Python
Pandas时间序列基础详解(转换,索引,切片)
2020/02/26 Python
python使用建议技巧分享(三)
2020/08/18 Python
英国女性时尚精品店:THE DRESSING ROOM
2018/05/23 全球购物
Pharmacy Online中文直邮网站:澳洲大型药房
2020/06/27 全球购物
医学专业毕业生个人的求职信
2013/12/04 职场文书
培训自我鉴定
2014/01/31 职场文书
2014年采购部工作总结
2014/11/20 职场文书
六年级学生期末评语
2014/12/26 职场文书
2015年办公室主任工作总结
2015/04/09 职场文书
奖励申请报告范文
2015/05/15 职场文书
幼儿园师德师风心得体会
2016/01/12 职场文书
pytorch显存一直变大的解决方案
2021/04/08 Python
sql通过日期判断年龄函数的示例代码
2021/07/16 SQL Server
java项目构建Gradle的使用教程
2022/03/24 Java/Android