WebForm頁面使用Ajax


 關於ajax我相信做B/S開發的程序員都不陌生,在做電子商務網站,還是其他的B/S架構的系統,ajax使用的都特別頻繁。那么ajax是什么呢?

  AJAX:”Asynchronous JavaScript and XML”
  中文意思:異步JavaScript和XML。指一種創建 交互式網頁應用的網頁開發技術。AJAX並非縮寫詞,而是由Jesse James Gaiiett創造的名詞。
  AJAX不是指一種單一的技術,而是有機地利用了一系列相關的技術:
  1、web標准( Standards-Based Presentation )XHTML+CSS的表示;
  2、使用 DOM( Document Object Model )進行動態顯示及交互;
  3、使用 XML 和 XSLT 進行數據交換及相關操作,使用 XMLHttpRequest 進行異步數據查詢、檢索.
   簡單理解為:JavaScript + XMLHttpRequest + CSS +服務器端 的集合.廢話少說,下面直接上代碼(這里我只寫以Post方式發送請求的代碼,關於JQuery中使用ajax跟以Get方式發送請求,我就不寫了),在下面的代碼中,我會從建立異步對象,到在WebForm頁面中使用異步對象來說說我的體會。
 
1、用js創建兼容瀏覽器的ajax異步對象
function createAjax() {
var ajaxObject = false;
try {
ajaxObject = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
ajaxObject = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {
ajaxObject = false;
}
}
if (!ajaxObject && typeof (XMLHttpRequest) != 'undefinded') {
ajaxObject = new XMLHttpRequest();
}
return ajaxObject;
}
 2、頁面中ajax的使用
<script type="text/javascript">
var ajaxObject;
window.onload = function () {
ajaxObject = createAjax();
getControl("btnOK").onclick = submitData1;
}
function submitData1() {
var txtName = getControl("txtName").value;
//以Post方式請求發送請求
ajaxObject.open("POST", "ResponseEnd.aspx", true);
//以Post方式發送異步請求需要設置請求頭
ajaxObject.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
ajaxObject.onreadystatechange = function () {
if (ajaxObject.readyState == 4) {
//狀態200表示異步對象已經完全接收完服務器響應的數據
if (ajaxObject.status == 200) {
var res = ajaxObject.responseText;
alert(res);
}
}
}
//發送異步請求(Post方式發送請求在send里面書寫自己要發送給服務器的參數)
ajaxObject.send("flag=1&name=" + txtName);
}
</script>
3、后台頁面ResponseEnd.aspx.cs對數據的處理
?
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
  
namespace Web
{
     public partial class ResponseEnd : System.Web.UI.Page
     {
         protected void Page_Load( object sender, EventArgs e)
         {
             if (! string .IsNullOrEmpty(Request[ "flag" ]))
             {
  
                 ShuChu();
             }
         }
         private void ShuChu()
         {
             #region 方法一
             //try
             //{
             //    string name = Request["name"];
             //    Response.Write(name);
             //}
             //catch (Exception ex)
             //{
             //    throw new Exception(ex.Message);
             //}
             //finally
             //{
             //    Response.End();
             //} 
             #endregion
  
             #region 方法二
             //try
             //{
             //    string name = Request["name"];
             //    Response.Write(name);
             //    this.Page.Visible = false;
             //    Context.ApplicationInstance.CompleteRequest();
             //}
             //catch (Exception ex)
             //{
             //    throw new Exception(ex.Message);
             //} 
             #endregion
  
             try
             {
                 string name = Request[ "name" ];
                 Response.Write(name);
                 Response.End();
             }
             catch (System.Threading.ThreadAbortException ex)
             {
             }
             catch (Exception ex)
             {
                 throw new Exception(ex.Message);
            
         }
     }
}

  關於Ajax,我相信做B/S開發的大蝦大牛們都特別的熟練,我寫這篇博客主要是針對在WebForm中使用ajax的時候,我們后台輸出我們想要的數據的時候要注意的地方,那就是:我們在Response.Write("data")輸出我們想要的數據,但是我們不想同時把頁面的html代碼也輸出那怎么辦?(如果異步對象把請求發送到一個ashx頁面中,或者發送到一個把前台頁面中的html代碼給刪除掉的aspx頁面中,我們也不用操心如何過濾掉html代碼,但開發中有的需求就是不能這樣處理),很多人用Response.End()來終止當前頁面的執行。這樣沒錯,但是要注意一點,如果你是try...catch里面使用了Response.End()的話,會被捕捉到一個異常:線程被中止"。這是因為:

Response.End 方法終止頁的執行,並將此執行切換到應用程序的事件管線中的Application_EndRequest 事件,同時拋出ThreadAbortException 異常,異常信息為“正在中止線程”。

 

那如果我在WebForm中使用ajax,並且是把請求發送給本頁面,同時我在后台頁面中只輸出我想要的數據,但不想輸出頁面的html代碼那怎么辦呢?這個我在上面的代碼中寫的很清楚了,我提供了三種解決方案,有碰到這個問題的各位朋友,可以參考我在ResponseEnd.aspx.cs里面寫的代碼,三種方式都能達到我們預期的效果。

  深入去學習ajax的話,我覺得這里頭的學問很大,哈哈,小弟不才,寫了這篇博客,希望各位不要笑話。如果哪位覺得可以看看的話就看看,覺得不堪的話,就一笑置之吧,呵呵。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM