zan php demo,ajax+php+mysql实现无刷新点赞功能

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

原理就是通过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就是一个查询和更新数据的，更新之后再把数据输出给页面。

整个demo下载

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

标签：names ready tle sse header 连接数据库字符集下载 function

本条技术文章来源于互联网，如果无意侵犯您的权益请点击此处反馈版权投诉

本文系统来源：https://www.cnblogs.com/10yearsmanong/p/12215749.html

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

java ajax无刷分页_asp.net+ajax+json来实现无刷新分页功能
现在做网站就是尽可能的提高用户体验,用户浏览网站尽可能不要刷新,响应速度尽可能的快,就是加载速度不好,也要告诉用户你已经很努力的在加载了(loading.....),下面来看看如何实现此功能 USE ...
Ajax弹出式无刷新城市选择特效
为什么80%的码农都做不了架构师?>>> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional// ...
php无刷新实现页面更新,使用laravel和ajax实现整个页面无刷新的操作方法
1.数据库文件 CREATE TABLE IF NOT EXISTS mr_key ( id int(11) NOT NULL PRIMARY KEY AUTO_INCREMENT COMMENT ' ...
jsp 页面刷新_如何应用XML+XSLT+AJAX组合技术实现无刷新数据查询
软件项目实训及课程设计指导--如何应用XML +XSLT +AJAX组合技术实现无刷新的数据查询的应用实例 1.在Web应用系统项目中添加一个实现查询的请求页面searchBook.jsp (1)创建 ...
利用JQUERY实现无刷新注册功能
利用JQUERY的$.getJSON()与后台数据异步传输,实现无刷新注册功能该方法有三个参数,$.getJSON(String url, Hash params, Function callbac ...
使用ajax和history.pushState无刷新改变页面URL
HTML5里引用了新的API,history.pushState和history.replaceState,就是通过这个接口做到无刷新改变页面URL的. 与传统的AJAX的区别传统的ajax有如下的 ...
在Ajax程序中实现无刷新换肤功能(asp.net2.0)
写了一年多的WEB程序,觉得程序中换肤的功能是非常吸引人眼球的技术.特别是在子父级的WEB平台与论坛上应用广泛,可以突出不同人的风格与个性. 从文章的标题上看是Ajax的无刷新换肤,只是本 ...
JavaWeb之Ajax,省市联动及无刷新数据分页
目录一,Ajax的作用二,$.ajax() 1.jQuery.ajax(url,[settings]) 2.$.ajax() 三,post 1.通过远程 HTTP POST 请求载入信息 2.jQ ...
mysql 去重根据id_点赞功能，用MySQL还是Redis
点赞功能是目前app开发基本的功能今天我们就来聊聊点赞.评论.收藏等这些场景的db数据库设计问题, 1. 我们先来看看场景的需求: 显示点赞数量判断用户是否点过赞,用于去重,必须的判断显示个人 ...

zan php demo,ajax+php+mysql实现无刷新点赞功能

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

最新文章

热门文章