首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 PHP

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+mysql+ajax 局部刷新点赞/取消点赞功能(每个账号只点赞一次)

- Author -

我是小黄鸭

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

PHP 相关文章推荐
第十一节--重载
Nov 16 PHP
set_include_path在win和linux下的区别
Jan 10 PHP
mysql5的sql文件导入到mysql4的方法
Oct 19 PHP
PHP字符串的编码问题的详细介绍
Apr 27 PHP
php定时计划任务的实现方法详解
Jun 06 PHP
PHP将两个关联数组合并函数提高函数效率
Mar 18 PHP
php简单分页类实现方法
Feb 26 PHP
PHP与Ajax相结合实现登录验证小Demo
Mar 16 PHP
PHP数学运算与数据处理实例分析
Apr 01 PHP
老生常谈PHP中的数据结构:DS扩展
Jul 17 PHP
PHP ajax+jQuery 实现批量删除功能实例代码小结
Dec 06 PHP
记Laravel调用Gin接口调用formData上传文件的实现方法
Dec 12 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
TypeScript(2) http_stub_status_module(1) RTMP(1) 缓存机制(1) 复合索引(1) zabbix(9) location(2) BufferPool(1) keeplive_timeout(1) text-shadow(1)
You might like
提升PHP性能的21种方法介绍
2013/06/25 PHP
php实现构建排除当前元素的乘积数组方法
2018/10/06 PHP
js中cookie的使用详细分析
2008/05/28 Javascript
JavaScript移除数组内重复元素的方法
2015/03/18 Javascript
js实现仿MSN带关闭功能的右下角弹窗代码
2015/09/04 Javascript
BootStrap中的table实现数据填充与分页应用小结
2016/05/26 Javascript
JS导出PDF插件的方法(支持中文、图片使用路径)
2016/07/12 Javascript
JavaScript利用Date实现简单的倒计时实例
2017/01/12 Javascript
jquery——九宫格大转盘抽奖实例
2017/01/16 Javascript
canvas滤镜效果实现代码
2017/02/06 Javascript
详解Vue.js 2.0 如何使用axios
2017/04/21 Javascript
angular内置provider之$compileProvider详解
2017/09/27 Javascript
layui复选框限制选择个数的方法
2019/09/18 Javascript
vue实现微信浏览器左上角返回按钮拦截功能
2020/01/18 Javascript
Node.js API详解之 console模块用法详解
2020/05/12 Javascript
浅谈Vue使用Elementui修改默认的最快方法
2020/12/05 Vue.js
paramiko模块安装和使用(远程登录服务器)
2014/01/27 Python
python实现汉诺塔方法汇总
2016/07/25 Python
VSCode下好用的Python插件及配置
2018/04/06 Python
Python实现购物车程序
2018/04/16 Python
Python Logging 日志记录入门学习
2018/06/02 Python
flask框架实现连接sqlite3数据库的方法分析
2018/07/16 Python
Tornado实现多进程/多线程的HTTP服务详解
2019/07/25 Python
python实现猜数字游戏
2020/03/25 Python
Python拆分大型CSV文件代码实例
2019/10/07 Python
Python面向对象程序设计之私有变量，私有方法原理与用法分析
2020/03/23 Python
详解css3 mask遮罩实现一些特效
2018/10/24 HTML / CSS
一级方程式赛车官方网上商店：F1 Store（支持中文）
2018/01/12 全球购物
你经历的项目中的SCM配置项主要有哪些？什么是配置项？
2013/11/04 面试题
职业女性的职业规划
2014/03/04 职场文书
大学生全国两会报告感想
2014/03/17 职场文书
宾馆仓管员岗位职责
2014/07/27 职场文书
医学专业大学生职业生涯规划书
2014/10/25 职场文书
HTML+CSS制作心跳特效的实现
2021/05/26 HTML / CSS
HTML5 语义化标签(移动端必备)
2021/08/23 HTML / CSS
2022新作动画《福星小子》释出宣传影片 加入内田真礼&宫野真守配音演出
2022/04/08 日漫