PHP開(kāi)發(fā)實(shí)作下載次數(shù)統(tǒng)計(jì)功能模組（三）

jQuery主要完成兩個(gè)任務(wù)，一是透過(guò)Ajax非同步讀取檔案清單並展示，二是回應(yīng)使用者點(diǎn)擊事件，將對(duì)應(yīng)的檔案下載次數(shù)+1。

首先，頁(yè)面載入完後，透過(guò)$.ajax()向後臺(tái)filelist.php發(fā)送GET形式的Ajax請(qǐng)求，當(dāng)filelist.php相應(yīng)成功後，接收返回的json數(shù)據(jù)，透過(guò)$. each()遍歷json資料對(duì)象，建構(gòu)html字串，並將最終得到的字串加入ul.filelist中，形成了demo中的檔案清單。

然後，點(diǎn)擊檔案下載時(shí)，透過(guò)live()回應(yīng)動(dòng)態(tài)加入的清單元素的click事件，將下載次數(shù)進(jìn)行累加。

<script type="text/javascript">
$(function(){
   $.ajax({  //異步請(qǐng)求
      type: 'GET',
      url: 'filelist.php',
      dataType: 'json',
      cache: false,
      beforeSend: function(){
         $(".filelist").html("<li class='load'>正在載入...</li>");
      },
      success: function(json){
         if(json){
            var li = '';
            $.each(json,function(index,array){
               li = li + '<li><a href="download.php?id='+array['id']+'">'+array['file']+'<span class="downcount" title="下載次數(shù)">'
               +array['downloads']+'</span><span class="download">點(diǎn)擊下載</span></a></li>';
              });
            $(".filelist").html(li);
         }
      }
   });
   $('ul.filelist a').live('click',function(){
      var count = $('.downcount',this);
      count.text(parseInt(count.text())+1);
   });
});
</script>

註解：

#ajax中的各種參數(shù)

1.type

##類(lèi)型： String

預(yù)設(shè)值: "GET")。請(qǐng)求方式 ("POST" 或 "GET")，預(yù)設(shè)為 "GET"。

2.url

類(lèi)型：String

預(yù)設(shè)值: 目前頁(yè)位址。發(fā)送請(qǐng)求的位址。

3.dataType

類(lèi)型：String

#預(yù)期伺服器傳回的資料類(lèi)型。這裡為"json": 傳回 JSON 資料。

4.cache