php+mysql+ajax 局部刷新點(diǎn)贊/取消點(diǎn)贊功能(每個(gè)賬號(hào)只點(diǎn)贊一次)
記錄每個(gè)贊的點(diǎn)贊用戶，以及對(duì)贊的數(shù)量統(tǒng)計(jì)首先判斷用戶是否點(diǎn)贊。根據(jù)是否點(diǎn)贊，載入不同的html，調(diào)用不同的方法
已點(diǎn)贊
如果已點(diǎn)贊，顯示已點(diǎn)贊的html，進(jìn)行取消點(diǎn)贊操作
未點(diǎn)贊
如果未點(diǎn)贊，顯示未點(diǎn)贊的html，進(jìn)行點(diǎn)贊操作
對(duì)于不同操作，對(duì)數(shù)據(jù)庫(kù)進(jìn)行增加或減少操作。同時(shí)對(duì)于不同用戶的點(diǎn)贊，進(jìn)行增加記錄或刪除記錄操作。通過(guò)控制不同按鈕的背景，來(lái)顯示不同的效果。通過(guò)記錄不同用戶的用戶id和贊的id之間的關(guān)系，進(jìn)行不同點(diǎn)贊的限制。
效果演示
當(dāng)用戶id為1時(shí)，進(jìn)行點(diǎn)贊，點(diǎn)贊數(shù)加1
更改用戶id,當(dāng)id為2時(shí)，用戶1的用戶已進(jìn)行了點(diǎn)贊，點(diǎn)贊數(shù)在用戶1點(diǎn)贊基礎(chǔ)上增加1
數(shù)據(jù)庫(kù)
數(shù)據(jù)庫(kù)，分為兩個(gè)數(shù)據(jù)表。一個(gè)進(jìn)行對(duì)點(diǎn)贊數(shù)的統(tǒng)計(jì)，一個(gè)進(jìn)行不同用戶的點(diǎn)贊記錄。
兩個(gè)數(shù)據(jù)表的詳細(xì)信息
連接數(shù)據(jù)庫(kù)
$con = new mysqli(’localhost’,’root’,’’,’test’);if (!$con){ die(’連接數(shù)據(jù)庫(kù)失敗，失敗原因：’ . mysqli_error());}else { // echo '連接成功';}
對(duì)用戶是否點(diǎn)贊進(jìn)行判斷（操作頁(yè)面）
對(duì)數(shù)據(jù)庫(kù)的信息進(jìn)行提取
//假設(shè)用戶編號(hào)為1$uId='1';//假設(shè)贊編號(hào)為1$zanId='1';//查找贊id為1的點(diǎn)贊數(shù)$count=mysqli_query($con, 'SELECT count FROM zanCount WHERE zanId=$zanId ');$countResult=mysqli_fetch_array($count);$countZan=$countResult[’count’];//查找改用戶是否對(duì)贊id為1 點(diǎn)贊$uIdLike=mysqli_query($con, 'SELECT * FROM zanRecord WHERE uId=$uId ');$result=mysqli_fetch_array($uIdLike);
對(duì)用戶是否點(diǎn)贊進(jìn)行判斷，并輸出不同的html
//點(diǎn)贊if (isset($result)) { $showZan.=<<<html <div id='dolikeDIV'> <button οnclick='zanDel()'></button> <span id='zan'>$countZan</span> </div>html; }//沒(méi)點(diǎn)贊else{ $showZan.=<<<html <div id='dolikeDIV'> <button ο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; }
調(diào)用的ajax方法
傳遞需要的數(shù)據(jù)，這里傳遞的時(shí)zanId 和uId記得引入jq文件點(diǎn)贊
function zan(){$.ajax({type:'POST',url:'./likeSever.php',data:{’zanId’:$('#zanId').val(),’uId’:$('#uId').val()},success:function(text){$('#dolikeDIV').html(text);}});}
取消點(diǎn)贊
function zanDel(){$.ajax({type:'POST',url:'./disSever.php',data:{’zanId’:$('#zanId').val(),’uId’:$('#uId').val()},success:function(text){$('#dolikeDIV').html(text);}});}
處理代碼
點(diǎn)贊處理
//更新贊總數(shù)的數(shù)據(jù) mysqli_query($con,'UPDATE zanCount SET count = count+1 WHERE zanId=$zanId'); //添加一條點(diǎn)贊記錄 mysqli_query($con,'INSERT INTO zanRecord(zanId,uId) VALUES($zanId, $uId); '); //查找贊的總數(shù) @$count=mysqli_query($con, 'SELECT count FROM zanCount WHERE zanId=$zanId '); @$countResult=mysqli_fetch_array($count); @$countZan=$countResult[’count’]; //更改輸出的html $show=''; $show=<<<html <button οnclick='zanDel()'></button><span id='zan'>$countZan</span>html; echo $show;
取消點(diǎn)贊處理
//更新贊總數(shù)的數(shù)據(jù) mysqli_query($con,'UPDATE zanCount SET count = count-1 WHERE zanId=$zanId'); //添加一條點(diǎn)贊記錄 mysqli_query($con,'DELETE FROM zanRecord WHERE zanId=$zanId AND uId=$uId '); //查找贊的總數(shù) @$count=mysqli_query($con, 'SELECT count FROM zanCount WHERE zanId=$zanId '); @$countResult=mysqli_fetch_array($count); @$countZan=$countResult[’count’]; //更新html $show=''; $show.=<<<html <button οnclick='zan()'></button><span id='zan'>$countZan</span>html;
點(diǎn)贊的圖片圖片自己畫(huà)的，有點(diǎn)不太美觀
jq下載地址完整demo下載
到此這篇關(guān)于php+mysql+ajax 局部刷新點(diǎn)贊/取消點(diǎn)贊功能(每個(gè)賬號(hào)只點(diǎn)贊一次)的文章就介紹到這了,更多相關(guān)php+mysql+ajax 局部刷新點(diǎn)贊內(nèi)容請(qǐng)搜索好吧啦網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持好吧啦網(wǎng)！
相關(guān)文章：
1. PHP擴(kuò)展之APC——Alternative PHP Cache(可選PHP緩存)2. HTML 絕對(duì)路徑與相對(duì)路徑概念詳細(xì)3. Django 模板中常用的過(guò)濾器實(shí)現(xiàn)4. XML入門(mén)精解之結(jié)構(gòu)與語(yǔ)法5. android RecycleView實(shí)現(xiàn)多級(jí)樹(shù)形列表6. Python數(shù)據(jù)可視化之用Matplotlib繪制常用圖形7. python 爬取京東指定商品評(píng)論并進(jìn)行情感分析8. Python中的np.argmin()和np.argmax()函數(shù)用法9. Xpath語(yǔ)法格式總結(jié)10. 教你用Python matplotlib庫(kù)制作簡(jiǎn)單的動(dòng)畫(huà)
網(wǎng)公網(wǎng)安備