php+mysql+ajax 局部刷新點(diǎn)贊/取消點(diǎn)贊功能(每個(gè)賬號(hào)只點(diǎn)贊一次)
記錄每個(gè)贊的點(diǎn)贊用戶,以及對贊的數(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)贊操作
對于不同操作,對數(shù)據(jù)庫進(jìn)行增加或減少操作。同時(shí)對于不同用戶的點(diǎn)贊,進(jìn)行增加記錄或刪除記錄操作。通過控制不同按鈕的背景,來顯示不同的效果。通過記錄不同用戶的用戶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ù)庫
數(shù)據(jù)庫,分為兩個(gè)數(shù)據(jù)表。一個(gè)進(jìn)行對點(diǎn)贊數(shù)的統(tǒng)計(jì),一個(gè)進(jìn)行不同用戶的點(diǎn)贊記錄。
兩個(gè)數(shù)據(jù)表的詳細(xì)信息
連接數(shù)據(jù)庫
$con = new mysqli(’localhost’,’root’,’’,’test’);if (!$con){ die(’連接數(shù)據(jù)庫失敗,失敗原因:’ . mysqli_error());}else { // echo '連接成功';}
對用戶是否點(diǎn)贊進(jìn)行判斷(操作頁面)
對數(shù)據(jù)庫的信息進(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’];//查找改用戶是否對贊id為1 點(diǎn)贊$uIdLike=mysqli_query($con, 'SELECT * FROM zanRecord WHERE uId=$uId ');$result=mysqli_fetch_array($uIdLike);
對用戶是否點(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; }//沒點(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)贊的圖片圖片自己畫的,有點(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)容請搜索好吧啦網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持好吧啦網(wǎng)!
相關(guān)文章:
1. ASP中解決“對象關(guān)閉時(shí),不允許操作。”的詭異問題……2. 匹配模式 - XSL教程 - 43. XML入門的常見問題(四)4. xml中的空格之完全解說5. html小技巧之td,div標(biāo)簽里內(nèi)容不換行6. ASP動(dòng)態(tài)網(wǎng)頁制作技術(shù)經(jīng)驗(yàn)分享7. msxml3.dll 錯(cuò)誤 800c0019 系統(tǒng)錯(cuò)誤:-2146697191解決方法8. WMLScript的語法基礎(chǔ)9. 解決ASP中http狀態(tài)跳轉(zhuǎn)返回錯(cuò)誤頁的問題10. ASP中if語句、select 、while循環(huán)的使用方法
