Ajax
1.AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)
2.创建Ajax
前言:IE5,6没有XMLHTTPRequest对象,用的是ActiveXObject("Microsoft.XMLHTTP");
var xmlhttp;
if(Window.XmlHttpRequest){
// IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
xmlhttp=new XmlHttpRequest();
}else{
//IE5,6
xmlhttp=new ActivexObject("Microsoft.XMLHTTP");
}
3.XmlHttpRequest的使用
1)发送数据
get方式:xmlhttp.open("GET","/try/ajax/demo_get.php?t=" + Math.random(),true)
xmlhttp.send();//这里就没有参数了参数在url中了
post方式:xmlhttp.open("POST",url地址,true)//这里的url没有传递的参数了
xmlhttp.send("fname=Henry&lname=Ford")//这里可以放参数而且类型不限
//send还可以设置请求头
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
第三个参数async=false时,不推荐这样后就不用写onreadystatechange();
2)接受数据
XmlHttpRequest有两个属性作为其从服务器放回的结果
responseText属性:返回结果是字符串
responseXML属性:返回结果是XML数据
AJAX的事件onreadystatechange():服务器返回结果,状态改变时触发,一般用来接受服务器返回数据的监听器
返回状态有:readyState:(0:请求未初始号;1:服务器连接已建立;2:请求已接收;3请求处理中;4:请求已完成,且响应已就绪)
state:200;404
例子:
var xmlhttp; if (str=="") { document.getElementById("txtHint").innerHTML=""; return; } if (window.XMLHttpRequest) { // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码 xmlhttp=new XMLHttpRequest(); } else { // IE6, IE5 浏览器执行代码 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById("txtHint").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","/try/ajax/getcustomer.php?q="+str,true); xmlhttp.send();