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中使用Oracle数据库(4)
Oct 09 PHP
用Flash图形化数据(二)
Oct 09 PHP
Win2003下APACHE+PHP5+MYSQL4+PHPMYADMIN 的简易安装配置
Nov 18 PHP
关于时间计算的结总
Dec 06 PHP
php Xdebug 调试扩展的安装与使用.
Mar 13 PHP
PHP+MySQL删除操作实例
Jan 21 PHP
php简单统计字符串单词数量的方法
Jun 19 PHP
php session的锁和并发
Jan 22 PHP
PHP实现无限分类的实现方法
Nov 14 PHP
php利用嵌套数组拼接与解析json的方法
Feb 07 PHP
laravel5.1框架model类查询的实现方法
Oct 08 PHP
php实现微信小程序授权登录功能(实现流程)
Nov 13 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中将一段数据存到一个txt文件中并显示其内容
2014/08/15 PHP
php的sso单点登录实现方法
2015/01/08 PHP
php+mysqli实现批量执行插入、更新及删除数据的方法
2015/01/29 PHP
实例讲解php将字符串输出到HTML
2019/01/27 PHP
Laravel使用原生sql语句并调用的方法
2019/10/09 PHP
菜单效果
2006/10/14 Javascript
飞鱼(shqlsl) javascript作品集
2006/12/16 Javascript
javascript 时间比较实现代码
2009/10/28 Javascript
javascript中this做事件参数相关问题解答
2013/03/17 Javascript
js根据日期判断星座的示例代码
2014/01/23 Javascript
JavaScript合并两个数组并去除重复项的方法
2015/06/13 Javascript
Javascript实现商品秒杀倒计时(时间与服务器时间同步)
2015/09/16 Javascript
jQuery EasyUI学习教程之datagrid点击列表头排序
2016/07/09 Javascript
第一次接触Bootstrap框架
2016/10/24 Javascript
Node.js测试中的Mock文件系统详解
2016/11/21 Javascript
利用jquery实现实时更新歌词的方法
2017/01/06 Javascript
Vue组件模板及组件互相引用代码实例
2020/03/11 Javascript
Element MessageBox弹框的具体使用
2020/07/27 Javascript
[01:17:12]职来职往完美电竞专场
2014/09/18 DOTA
Python多进程机制实例详解
2015/07/02 Python
Python中列表元素转为数字的方法分析
2016/06/14 Python
Python中强大的命令行库click入门教程
2016/12/26 Python
Python3学习笔记之列表方法示例详解
2017/10/06 Python
tensorflow构建BP神经网络的方法
2018/03/12 Python
Python对数据进行插值和下采样的方法
2018/07/03 Python
Tensorflow之梯度裁剪的实现示例
2020/03/08 Python
CSS3 清除浮动的方法示例
2018/06/01 HTML / CSS
仓库主管岗位职责
2014/03/02 职场文书
新闻传媒系求职信范文
2014/04/19 职场文书
白岩松演讲
2014/05/21 职场文书
植物生产学专业求职信
2014/08/08 职场文书
2014年终个人工作总结
2014/11/07 职场文书
导游词之山西祁县乔家大院
2019/10/14 职场文书
python绘制箱型图
2021/04/27 Python
mysql left join快速转inner join的过程
2021/06/30 MySQL
分享7个 Python 实战项目练习
2022/03/03 Python