js ajax php mysql_ajax+php+mysql实现无刷新点赞功能

快来打我* 2022-10-24 11:56 152阅读 0赞

![15fd92a48691a932e1a10125634f0241.gif][]

从动态图看出来，点击赞的按钮的时候，旁边的赞数量在无刷新地增加。打开数据库也能看到赞数量更新了。

原理就是通过ajax异步提交数据给数据库。

首先前端页面就是一个按钮和赞数量。

数据库名，test，表名zan，字段zan

ajaxindex.php

异步提交

赞

$con = mysql\_connect("localhost","root","root");

if (!$con)

\{

die('连接数据库失败，失败原因：' . mysql\_error());

\}

//设置数据库字符集

mysql\_query("SET NAMES UTF8");

//查询数据库

mysql\_select\_db("test", $con);

$result = mysql\_query("SELECT \* FROM zan");

while($row = mysql\_fetch\_array($result))

\{

echo $row\['zan'\];

\}

//关闭连接

mysql\_close($con);

?>

ajaxindex.js

$(document).ready(function()\{

$("\#btn").on("click",function()\{

$.get("sever.php",\{name:$("\#btn").val()\},function(data)\{

$("\#result").text(data);

\});

\});

\});

sever.php

header("Content-type:text/html;charset=utf-8");

//连接数据库

$con = mysql\_connect("localhost","root","root");

if (!$con)

\{

die('连接数据库失败，失败原因：' . mysql\_error());

\}

//设置数据库字符集

mysql\_query("SET NAMES UTF8");

//查询数据库

mysql\_select\_db("test", $con);

//更新

mysql\_query("UPDATE zan SET zan = zan+1");

$result = mysql\_query("SELECT \* FROM zan");

if(isset($\_GET\['name'\]))\{

while($row = mysql\_fetch\_array($result))

\{

echo $row\['zan'\];

\}

\}else\{

echo "赞失败！";

\}

//关闭连接

mysql\_close($con);

?>

总体思路：

通过ajaxindex.php点击按钮，js反应，ajax异步提交给sever.php再通过js返回给页面，就不用刷新了。

sever.php就是一个查询和更新数据的，更新之后再把数据输出给页面。

[15fd92a48691a932e1a10125634f0241.gif]: /images/20221024/c55811e5ddbb47a69183f5ff68c9c27f.png

发表评论取消回复

表情：

评论列表（有 0 条评论，152人围观）

还没有评论，来说两句吧...

相关阅读

相关 php ajax邮箱,php jquery ajax邮箱地址无刷新验证实例

要实现无刷新页面我们一般会用到ajax来实现，以前是使用最原始的js ajax验证现在常用的jquery ajax了只要简单的一句post即可解决了，下面我们看实例 inde

Love The Way You Lie/ 2023年01月15日 03:37/ 0 赞/ 137 阅读

相关帝国 php ajax分页,怎么在php中利用ajax实现一个无刷新分页功能

怎么在php中利用ajax实现一个无刷新分页功能发布时间：2021-01-19 16:22:23 来源：亿速云阅读：60 作者：Leah 怎么在php中利用aja

Dear 丶/ 2023年01月13日 04:15/ 0 赞/ 163 阅读

相关 phpcms 点赞_php+mysql结合Ajax实现点赞功能完整实例

本文实例讲述了php+mysql结合Ajax实现点赞功能的方法。分享给大家供大家参考。具体如下：要实现点赞功能，有多种实现方式，这里总结一下利用Ajax，php和mysql

逃离我推掉我的手/ 2022年12月31日 10:29/ 0 赞/ 141 阅读

相关 java实现点赞(顶)功能

java实现点赞(顶)功能 ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6

朱雀/ 2022年11月28日 16:30/ 0 赞/ 202 阅读

相关 php 实现无刷新点赞,ajax+php+mysql实现无刷新点赞功能

![15fd92a48691a932e1a10125634f0241.gif][] 从动态器打好基下是求的响的可域适的一的近重交的图看出来，点击赞的按钮的时候，旁边的赞数量在

r囧r小猫/ 2022年11月12日 13:51/ 0 赞/ 199 阅读

相关 js ajax php mysql_ajax+php+mysql实现无刷新点赞功能

![15fd92a48691a932e1a10125634f0241.gif][] 从动态图看出来，点击赞的按钮的时候，旁边的赞数量在无刷新地增加。打开数据库也能看到赞数量更

快来打我*/ 2022年10月24日 11:56/ 0 赞/ 153 阅读

相关局部刷新ListView，实现点赞功能

今天看到一个需要实现一个点赞的功能。自己想没想明白，后来看了http://blog.csdn.net/nupt123456789/article/details/3943278

落日映苍穹つ/ 2022年08月21日 00:20/ 0 赞/ 191 阅读

相关 jQuery-简单点赞功能实现

jQuery-简单点赞功能实现感谢云知梦。全部代码如下： ![这里写图片描述][SouthEast] ![这里写图片描述][SouthEast 1] !

叁歲伎倆/ 2022年06月11日 02:53/ 1 赞/ 212 阅读

相关 springmvc实现点赞功能

实现步骤： 1.设计表： -- ---------------------------- -- Table structure for `nice

系统管理员/ 2022年05月20日 00:41/ 0 赞/ 277 阅读

相关 JS脚本实现CSDN自动点赞功能及搜索功能

首先下载一个我个人认为比较好用的插件Tampermonkey，然后就可以在上面自定义一些插件了 ![在这里插入图片描述][watermark_type_ZmFuZ3poZW

﹏ヽ暗。殇╰゛Y/ 2022年03月16日 12:16/ 3 赞/ 571 阅读