Ajax

---恢复内容开始---

一.javascript实现

function Ajax(){
 var xmlHttpReq = null; //声明一个空对象用来装入XMLHttpRequest
 if (window.ActiveXObject){//IE5 IE6是以ActiveXObject的方式引入XMLHttpRequest的
  xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
 }
 else if (window.XMLHttpRequest){//除IE5 IE6 以外的浏览器XMLHttpRequest是window的子对象
  xmlHttpReq = new XMLHttpRequest();//实例化一个XMLHttpRequest
 }
 if(xmlHttpReq != null){ //如果对象实例化成功
  xmlHttpReq.open("GET","test.jsp",true); //调用open()方法并采用异步方式
  xmlHttpReq.onreadystatechange=RequestCallBack; //设置回调函数
  xmlHttpReq.send(null); //因为使用get方式提交,所以可以使用null参调用
 }
 function RequestCallBack(){//一旦readyState值改变,将会调用这个函数
  if(xmlHttpReq.readyState == 4){
    if(xmlHttpReq.status == 200){
     //将xmlHttpReq.responseText的值赋给ID为 resText 的元素
     document.getElementById("resText").innerHTML = xmlHttpReq.responseText;
    }
  }
 }
}
</script>

html部分:
<input type="button" id="" value="Ajax提交" onclick="Ajax();" />
<div id="resText" ></div>

二.jquery实现

1.load(url [,data] [ , callback] ): 通常用来从web服务器上获取静态的数据文件。

url:待装入 HTML 网页网址。

data:发送至服务器的 key/value 数据。在jQuery 1.3中也可以接受一个字符串了。

callback:载入成功时回调函数

 $("#feeds").load("feeds.php", {limit: 25}, function(){
   alert("The last 25 entries in the feed have been loaded");
 });
2.$.get(url[,data] [,callback] [,type])

url:待载入页面的URL地址

data:待发送 Key/value 参数。

callback:载入成功时回调函数。

type:返回内容格式,xml, html, script, json, text, _default。

ajax效果:
<div id="my" style=" display:none"><img src="loading.gif" /></div>
  $("#my").ajaxStart(function(){
             $(this).show();
         }).ajaxStop(function(){
           $(this).hide();
         });






---恢复内容结束---

一.javascript实现

function Ajax(){
 var xmlHttpReq = null; //声明一个空对象用来装入XMLHttpRequest
 if (window.ActiveXObject){//IE5 IE6是以ActiveXObject的方式引入XMLHttpRequest的
  xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
 }
 else if (window.XMLHttpRequest){//除IE5 IE6 以外的浏览器XMLHttpRequest是window的子对象
  xmlHttpReq = new XMLHttpRequest();//实例化一个XMLHttpRequest
 }
 if(xmlHttpReq != null){ //如果对象实例化成功
  xmlHttpReq.open("GET","test.jsp",true); //调用open()方法并采用异步方式
  xmlHttpReq.onreadystatechange=RequestCallBack; //设置回调函数
  xmlHttpReq.send(null); //因为使用get方式提交,所以可以使用null参调用
 }
 function RequestCallBack(){//一旦readyState值改变,将会调用这个函数
  if(xmlHttpReq.readyState == 4){
    if(xmlHttpReq.status == 200){
     //将xmlHttpReq.responseText的值赋给ID为 resText 的元素
     document.getElementById("resText").innerHTML = xmlHttpReq.responseText;
    }
  }
 }
}
</script>

html部分:
<input type="button" id="" value="Ajax提交" onclick="Ajax();" />
<div id="resText" ></div>

二.jquery实现

1.load(url [,data] [ , callback] ): 通常用来从web服务器上获取静态的数据文件。

url:待装入 HTML 网页网址。

data:发送至服务器的 key/value 数据。在jQuery 1.3中也可以接受一个字符串了。

callback:载入成功时回调函数

 $("#feeds").load("feeds.php", {limit: 25}, function(){
   alert("The last 25 entries in the feed have been loaded");
 });
2.$.get(url[,data] [,callback] [,type])

url:待载入页面的URL地址

data:待发送 Key/value 参数。

callback:载入成功时回调函数。

type:返回内容格式,xml, html, script, json, text, _default。









原文地址:https://www.cnblogs.com/peng14/p/3148693.html