2015年10月13日 星期二

使用ajax非同步更新網頁資料

至https://jquery.com/
下載jquery,複製到網站伺服器上

在<head>中引用jquery
<script type="text/javascript" src="jquery-2.1.4.js"></script>


要非同步更新的物件
 <span id="LiveUsers" style="color:#99FF33;">目前人數0,總人數0</span>



計算人數的程式寫在ashx上,回傳字串為"1,1"使用java script,至每隔一秒更新資料


<script type="text/javascript">    

//至ashx取出回應的資料,
       function UserCountValue() {
           $.ajax({
               url: "VideoUserCount.ashx",  //程式路徑
               contentType: "text/plain",     //回傳資型態
               success: function (rvalue) {
                   var a = rvalue.split(',');    //拆解字串取出要顯示的值
                   $("#LiveUsers").text("目前人數 " + a[0] + ", 總人數 " + a[1]);                        
               },
           })
       }

//第一次啟動網頁時先執行一次
       UserCountValue();

//每隔一秒更新一次
       setInterval("UserCountValue()", 1000);    
 </script>

2 則留言:

  1. 你好,我想問一下,其實我想利用Visual Studio 2015(以下簡稱VB2015) 來編輯.ashx檔,但我的VB2015範本中沒有.ashx檔的範本,想請問你是用什麼IDE編輯.ashx檔?還是有什麼下載VB2015.ashx範本的辦法?謝謝

    回覆刪除
  2. 作者已經移除這則留言。

    回覆刪除