php+mysql結合Ajax實現點贊功能完整實例

文章主要介紹了php+mysql結合Ajax實現點贊功能,以一個完整實例形式詳細分析了實現點贊功能中涉及的html頁面、Ajax功能及php方法的使用技巧,非常具有實用價值,需要的朋友可以參考下。

php+mysql結合Ajax實現點贊功能完整實例

要實現點贊功能,有多種實現方式,這裏總結一下利用Ajax,php和mysql來實現點讚的數據的功能。具體步驟如下:

  一、頁面中的HTML代碼部分:

?

1

2

3

4

5

6

7

8

9

10

11

<span>0</span>

<button onclick="goodplus(1);">good+1</button>

<span>0</span>

<button onclick="goodplus(2);">good+1</button>

<span>0</span>

<button onclick="goodplus(3);">good+1</button>

<span>0</span>

<button onclick="goodplus(4);">good+1</button>

  二、寫javascript

1、實現上面的button的.點擊事件goodplus

?

1

2

3

4

5

6

7

8

9

10

11

12

13

14

var span = lementsByTagName('span');//獲取存放點贊數的dom

var num; //點贊數

var flag = 0; //不同情況的標記

function goodplus(gindex){

flag = 1;

num = parseInt((gindex-1)rHTML);

if(checkcookie(gindex) == true){

num = num + 1;

senddata(gindex); //通過Ajax修改頁面上的數據

}else{

alert("你已經點過贊咯!")

}

}

2、頁面一打開時就應該更新點贊數據

?

1

2

3

for(var i = 1; i < th + 1; i++){

senddata(i);

}

3、通過Ajax獲取數據senddata函數

?

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

function senddata(aindex){

var xmlhttp;

var txt;

if(ttpRequest){

xmlhttp=new XMLHttpRequest();

}else{

xmlhttp=new ActiveXObject("TTP");

}

adystatechange=function(){

if(yState == 4 && us == 200){

txt = onseText; //獲取返回的數據

var cookieindex = aindex - 1;

lementsByTagName('span')(cookieindex)rHTML = txt; //賦值

}

}

("GET","路徑/ + num + '&flag=' + flag + '&aindex=' + aindex,true);

();

}

4、通過設置cookie來判斷是否已經點贊,如果有cookie則提示已經點贊,如果沒有cookie則允許點贊,而且會設置cookie

?

1

2

3

4

5

6

7

8

9

10

11

12