Welcome

首页 / 脚本样式 / Ajax / 在ASP.NET中使用无框架的Ajax实例

在ASP.NET中使用无框架的Ajax实例2011-12-26我们需要两个页面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>