ajax+php+mysql實現(xiàn)無刷新點贊功能

WalkerXu 發(fā)布于2019-08-01 17:21 / 1022人閱讀

摘要：從動態(tài)圖看出來，點擊贊的按鈕的時候，旁邊的贊數(shù)量在無刷新地增加。打開數(shù)據(jù)庫也能看到贊數(shù)量更新了。原理就是通過異步提交數(shù)據(jù)給數(shù)據(jù)庫。就是一個查詢和更新數(shù)據(jù)的，更新之后再把數(shù)據(jù)輸出給頁面。

從動態(tài)圖看出來，點擊贊的按鈕的時候，旁邊的贊數(shù)量在無刷新地增加。打開數(shù)據(jù)庫也能看到贊數(shù)量更新了。

原理就是通過ajax異步提交數(shù)據(jù)給數(shù)據(jù)庫。
首先前端頁面就是一個按鈕和贊數(shù)量。

數(shù)據(jù)庫名，test，表名zan，字段zan

ajaxindex.php




    
    異步提交

ajaxindex.js

$(document).ready(function(){
    $("#btn").on("click",function(){
        $.get("sever.php",{name:$("#btn").val()},function(data){
            $("#result").text(data);
        });
    });
});

sever.php

總體思路：
通過ajaxindex.php點擊按鈕，js反應，ajax異步提交給sever.php再通過js返回給頁面，就不用刷新了。
sever.php就是一個查詢和更新數(shù)據(jù)的，更新之后再把數(shù)據(jù)輸出給頁面。

整個demo下載

云數(shù)據(jù)庫MySQL php實現(xiàn)無刷新跳轉(zhuǎn) Ajax無刷新無刷新ajax分頁 ajax無刷新頁面

文章版權歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/51116.html

ajax+php+mysql實現(xiàn)無刷新點贊功能

摘要：從動態(tài)圖看出來，點擊贊的按鈕的時候，旁邊的贊數(shù)量在無刷新地增加。打開數(shù)據(jù)庫也能看到贊數(shù)量更新了。原理就是通過異步提交數(shù)據(jù)給數(shù)據(jù)庫。就是一個查詢和更新數(shù)據(jù)的，更新之后再把數(shù)據(jù)輸出給頁面。 showImg(https://segmentfault.com/img/bVSr29?w=579&h=412); 從動態(tài)圖看出來，點擊贊的按鈕的時候，旁邊的贊數(shù)量在無刷新地增加。打開數(shù)據(jù)庫也能看到贊數(shù)...

wdzgege 2019-06-28 13:22 評論0 收藏0
ajax+php+mysql實現(xiàn)無刷新點贊功能

摘要：從動態(tài)圖看出來，點擊贊的按鈕的時候，旁邊的贊數(shù)量在無刷新地增加。打開數(shù)據(jù)庫也能看到贊數(shù)量更新了。原理就是通過異步提交數(shù)據(jù)給數(shù)據(jù)庫。就是一個查詢和更新數(shù)據(jù)的，更新之后再把數(shù)據(jù)輸出給頁面。 showImg(https://segmentfault.com/img/bVSr29?w=579&h=412); 從動態(tài)圖看出來，點擊贊的按鈕的時候，旁邊的贊數(shù)量在無刷新地增加。打開數(shù)據(jù)庫也能看到贊數(shù)...

Juven 2019-08-20 18:36 評論0 收藏0
jQuery+AJAX+PHP+MySQL數(shù)據(jù)庫開發(fā)搜索功能，無跳轉(zhuǎn)無刷新搜索。

摘要：知識點提交表單，查詢數(shù)據(jù)庫，返回數(shù)組，遍歷輸出數(shù)組演示當表單無輸入任何關鍵詞的時候，返回請輸入關鍵詞當表單輸入的關鍵詞查詢無果的時候，返回無結果當表單輸入的關鍵詞查詢有結果，則返回結果。知識點：ajax提交表單，php查詢數(shù)據(jù)庫，php返回json數(shù)組，javascript遍歷輸出json數(shù)組演示： 1、當表單無輸入任何關鍵詞的時候，返回請輸入關鍵詞... showImg(http...

starsfun 2019-08-22 18:41 評論0 收藏0
jQuery+AJAX+PHP+MySQL數(shù)據(jù)庫開發(fā)搜索功能，無跳轉(zhuǎn)無刷新搜索。

摘要：知識點提交表單，查詢數(shù)據(jù)庫，返回數(shù)組，遍歷輸出數(shù)組演示當表單無輸入任何關鍵詞的時候，返回請輸入關鍵詞當表單輸入的關鍵詞查詢無果的時候，返回無結果當表單輸入的關鍵詞查詢有結果，則返回結果。知識點：ajax提交表單，php查詢數(shù)據(jù)庫，php返回json數(shù)組，javascript遍歷輸出json數(shù)組演示： 1、當表單無輸入任何關鍵詞的時候，返回請輸入關鍵詞... showImg(http...

yagami 2019-07-01 10:19 評論0 收藏0