ajax

本文介绍了一种兼容多种浏览器的AJAX实现方法,通过判断浏览器类型选择合适的XMLHttpRequest对象,实现了GET请求来获取远程数据,并根据不同状态更新页面提示。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

´´½¨Ò»¸öXMLHTTP¶ÔÏó
Microsoft Internet Explorerä¯ÀÀÆ÷ʹÓÃMSXML½âÎöÆ÷´¦ÀíXML£¬MSXMLʵ¼ÊÉÏÓÐÁ½ÖÖ²»Í¬µÄ°æ±¾xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
¶ÔÓÚ·Ç Microsoft ä¯ÀÀÆ÷(Mozilla¡¢Firefox¡¢Safari¡¢Opera):
xmlHttp = new XMLHttpRequest();

function getXmlHttp()
{
 var xmlHttp = null;
 
 if ( window.XMLHttpRequest)
 {
  xmlHttp = new XMLHttpRequest();
  if (xmlHttp.overrideMimeType)
   xmlHttp.overrideMimeType("text/xml");
 }
 else if ( window.ActiveXObject)
 {
  try
  {
   xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
  }
  catch(e)
  {
   xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
  }
 }
 
 if ( !xmlHttp)
 {
  window.alert("XmlHttp not be Supported!"); 
 }
 
 return xmlHttp;
}

ÏÂÃæµÄ´úÂë˵Ã÷ÁËÈçºÎ´Ó´´½¨µ½³õʼ»¯XMLHTTPµ½·¢ËÍÊý¾ÝµÄ¹ý³Ì£¬²¢Ö¸¶¨´¦Àí·µ»ØÊý¾ÝµÄʼþ¾ä±ú

var xmlHttp = null;
 
function callServer(url)
{
 xmlHttp = getXmlHttp();
 xmlHttp.onReadyStateChange = setPage;
 xmlHttp.open("GET",url,true);
 xmlHttp.send();  
 document.getElementById("loading").innerHTML = "ÕýÔÚ¼ÓÔØ...";
}

µÃµ½·µ»ØÊý¾Ý²¢¸üÐÂÒ³Ãæ
function setPage()
{  
 switch(xmlHttp.readyState)
 {
  case 0:
   document.getElementById("loading").innerHTML = "ÕýÔÚ³õʼ»¯...";
   break;
  case 1:
   document.getElementById("loading").innerHTML = "ÕýÔÚ¼ÓÔØ...";
   break;
  case 2:
   document.getElementById("loading").innerHTML = "ÒѼÓÔØÍê³É...";
   break;
  case 3:
   document.getElementById("loading").innerHTML = "ÕýÔÚ½ÓÊÕÊý¾Ý...";
   break;
  case 4:
   document.getElementById("loading").innerHTML = "ÒÑÍê³É!";
   break;
 }    
 
 if ( xmlHttp.readyState == 4)
 {
  if ( xmlHttp.status == 200)
  {
   document.getElementById("content").innerText = xmlHttp.responseText;
  }
  xmlHttp.abort();   
 }
}


HTML £º

<input name="url" id="url" type="text" value="http://www.sohu.com"><input type="button" onclick="callServer(document.getElementById('url').value)" value="get data">&nbsp;<BR>
<div id="loading" style="color:red; font-size:12px;"></div>           
<span id="content"></span>
 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值