原始javascript的AJAX

 1 xmlHttpResquest对象
 2 创建xmlHttpRequest对象
 3 function createXmlHttp(){
 4     if(windows.ActiveXObject){
 5         xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
 6     }else{
 7         xmlHttp=new XMLHttpResquest();
 8     }
 9 }
10 function getSend(){
11     cretaeXmlHttp();
12     //xmlHttp.open("get","us.do?uname="+form1.userNmae.value.false);
13     xmlHttp.open("post","us.do",true);//建立对服务器端的调用
14     xmlHttp.setResponseHeader("Content-Type","application/x-www-form-urlencoded");
15     xmlHttp.onreadystatechange=getData;//设置对象状态发生改变时要调用的函数
16     xmlHttp.send("uname="+form1.userName.value);//向服务器发送请求
17 }
18 function getData(){
19     alert(xmlHttp.readyState);
20     if(xmlHttp.readyState=4&&xmlHttp.status==200){
21         var resp=xmlHttp.responseText;
22         if(resp=="true"){
23             document.createElement("img");
24             document.getElementById("us").innerHTML="用户名已存在";
25         }
26         else{
27             document.getElementById("us").innerHTML="用户名可以正常使用"
28         }
29     }
30 }
31 <form action="" name="form1">
32 <input type="text" name="userName" onblur="sendData();">
33 <span id="us"></span>
34 </form>

35 /*
36 方法:
37 abort()停止当前请求
38 getAllResponseHeaders()将所有HTTP请求的相应首部作为键值对返回
39 getResponseHeader("")返回指定的首部信息
40 open("method","URL")建立对服务器的调用，方法通常是post/get，URL可以使绝对路径/相对路径
41 send(content)想服务器发送请求，参数可以为null
42 setResponseHeader("header","value")设置HTTP请求的首部信息，可以向服务器传递参数，这个方法必须在open之后调用
43 属性：
44 Onreadystatechange每次状态改变所触发事件的事件处理程序
45 readyState对象状态值（0：未初始化 1：正在加载 2：加载完毕 3.交互 4. 完成）
46 responseText从服务器进程返回的数据的字符串形式
47 responseXML从服务器进程返回的DOM兼容的文档数据对象
48 status从服务器返回的数字代码，如404/200
49 statusText伴随状态码的字符串信息
50 
51 ajax执行过程：
52 1.触发javascript事件
53 2.创建获得XMLHttpRequest对象
54 3.通过open方法建立对服务器的调用
55 4.设置回调函数
56 5.调用send方法发送请求
57 6.服务器处理请求
58 7.通过回调函数处理响应
59 8.继续操作
60 
61 同步(false)：
62 异步(true)：*/
posted @ 2018-07-31 18:01 芲落阅读(148) 评论(0) 收藏举报
刷新页面返回顶部
芲落

原始javascript的AJAX

公告
