許多的網(wǎng)站都有點贊功能,這不僅能提高網(wǎng)站的用戶粘性沽损,還能帶動其他的用途灯节。
比如說點贊越高的越排在前面等等。
今天小編分享的文章绵估,就是使用jquery+ajax實現(xiàn)文章點贊功能炎疆,實例很簡單。
比網(wǎng)上其他的一些方法簡潔很多国裳。
首先我們需要有一個點擊的元素形入。
html代碼點我贊一個吧99
然后就是核心的jquery代碼了,我們要使用到ajax實現(xiàn)無刷新缝左。
以下為javascript代碼
$(document).on("click",".like",function(){
vardataid=$(this).attr("data-id");
varurl='santii.com/test/ajax.php?id='+dataid;
$.ajax({
url: url,
type:'get',
dataType:'json',
success:function(data){
$('.zan').html(data.html);
}
});
});
上面的js代碼里面亿遂,我們有一個ajax文件。
這個文件里面渺杉,我們先獲取url傳過來的id蛇数。
然后根據(jù)id,使用update語句更新表里面存“點贊”的這個字段是越,每點擊一次就加1耳舅。
然后再使用select語句獲取對應(yīng)id的“點贊”字段里面的數(shù)據(jù),將結(jié)果存到數(shù)組里面倚评,返回json數(shù)據(jù)挽放。
可能有些小伙伴不知道如何獲取返回的json數(shù)據(jù)绍赛,其實很簡單。
php代碼
<?php
//相關(guān)的sql語然,按照你自己的來,根據(jù)獲取的id,update新"贊"那個字段,每點一次就+1
//然后再獲取"贊"字段的最新值
$data=array(
"html"=>100//這里是獲取到的點贊的最新值
);
}
echojson_encode($data);
?>
就是最后的那句“echo json_encode($data);”辑畦。
在js里面,因為我們定義的是data腿倚,所以獲取數(shù)據(jù)的時候就是“data.html”對應(yīng)php里面返回的數(shù)據(jù)纯出。
就是這樣,很簡單的使用jquery+ajax就實現(xiàn)了文章的點贊功能敷燎。
本文轉(zhuǎn)載自三體教程 ajax文章點贊?http://www.santii.com/article/28.html