如何在ASP.NET中使用无框架的Ajax

这期内容当中小编将会给大家带来有关如何在ASP.NET中使用无框架的Ajax，文章内容丰富且以专业的角度为大家分析和叙述，阅读完这篇文章希望大家可以有所收获。

我们需要两个页面a.aspx、b.aspx，a页面代码如下（就用最常见的，两个下拉列表连动的例子）：

＜body＞    ＜form id="Form1" method="post" runat="server"＞    ＜select id="AList" onchange=SetBList()"＞        ＜option value="0"＞A＜/option＞        ＜option value="1"＞B＜/option＞        ＜option value="3"＞C＜/option＞    ＜/select＞    ＜select id="BList"＞＜/select＞    ＜/form＞ ＜/body＞

当a页面触发onchange事件后，我们进入写在a页面的SetBList()方法中，这里将完整的js列出来：

＜script language="javascript"＞var xmlHttp;function SetBList() {    var avalue = document.getElementById("AList").value;    var url = "b.aspx?Avalue=" + avalue;    createXMLHttpRequest();  // 创建xmlHttp对象    xmlHttp.onreadystatechange = handleStateChange;  // 当xmlHttp状态码发生改变时，调用handleStateChage方法    xmlHttp.open("GET", url, true);   // GET方法发送请求    xmlHttp.send(null);}function BListInitial() {    // 先清空一下BList的option    clearBList();    var blist = document.getElementById("BList");  // 获取BList对象    var rs = xmlHttp.responseXML.getElementsByTagName("City");  // 从返回xml文档中，读取＜City＞标签的数据    // 这个循环取值的地方，卡了我一会，将xmlHttp.responseXML创建成一个xml文档，然后找读文档的方法，但问题是不同浏览器创建xml文档的方法不一样    for(var i=0;i＜rs.length;i++) {        var option = document.createElement("OPTION");        option.text = rs[i].getElementsByTagName("CityName");        option.value = rs[i].getElementsByTagName("CityCode");        blist.options.add(option);    }}function clearBList() {    var ven = document.getElementById("VendorList");    while(ven.options.length ＞ 0)        ven.removeChild(ven.childNodes[0]);}function handleStateChange() {    if(xmlHttp.readyState == 4) {        if(xmlHttp.status == 200) {            BListInitial();        }    }}function createXMLHttpRequest() {    // IE    if (window.ActiveXObject) {        xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");    }     // Mozilla    else if (window.XMLHttpRequest) {        xmlHttp = new XMLHttpRequest();    }}＜/script＞

b.aspx页面将html部分全部删除，仅仅留一行：

＜%@ Page language="c#" Codebehind="b.aspx.cs" AutoEventWireup="false" Inherites="Test.Ajax" %＞

原因是我们a页面要求返回的xml文档，因此，我们将Html标签部分删除。然后在b页面的Page_Load方法中，对数据库进行操作，然后数据写成xml的格式，例如：

// 数据库操作，得到DataTable dtstring xml = "＜Data＞";foreach(DataRow row in dt.Rows)  {    xml += "＜City＞";    xml += "＜CityName＞" + row["CityName"] + "＜/CityName＞";    xml += "＜CityCode＞" + row["CityCode"] + "＜/CityCode＞";    xml += "＜/City＞";}xml += "＜/Data＞";//  清页面格式，写xmlResponse.ClearContent();Response.Cache.SetNoStore();Response.ContentType = "text/xml";Response.ContentEncoding = System.Text.Encoding.UTF8;Response.Write(xml);

在整体运行之前可以先将b页面测试一下，如果得到类似如下结果，则说明，数据部分是没问题的。

- ＜Data＞    - ＜Vendor＞        ＜VendorId＞7＜/VendorId＞        ＜VendorName＞千千＜/VendorName＞    ＜/Vendor＞＜/Data＞

上述就是小编为大家分享的如何在ASP.NET中使用无框架的Ajax了，如果刚好有类似的疑惑，不妨参照上述分析进行理解。如果想知道更多相关知识，欢迎关注行业资讯频道。