JS如何实现Ajax的请求函数

Question

JS如何实现Ajax的请求函数

Answer 1

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33

<script type="text/javascript">       //请求函数       function f1(){           console.log('start');           //1.创建AJAX对象           var ajax = new XMLHttpRequest();                       //4.给AJAX设置事件(这里最多感知4[1-4]个状态)           ajax.onreadystatechange = function(){               //5.获取响应               //responseText      以字符串的形式接收服务器返回的信息               //console.log(ajax.readyState);               if(ajax.readyState == 4 && ajax.status == 200){                   var msg = ajax.responseText;                   console.log(msg);                   //alert(msg);                   var divtag = document.getElementById('result');                   divtag.innerHTML = msg;               }           }                       //2.创建http请求,并设置请求地址           var username = document.getElementsByTagName('input')[0].value;           var email = document.getElementsByTagName('input')[1].value;           username = encodeURIComponent(username);    //对输入的特殊符号(&,=等)进行编码           email = encodeURIComponent(email);           ajax.open('get','response.php?username='+username+'&email='+email);                       //3.发送请求(get--null    post--数据)           ajax.send(null);       }           </script>

 

Answer 2

var request =null;
if(window.XMLHttpRequest){
request=new XMLHttpRequest(); //ie7+
}else{
request=new ActiveXObject(Microsoft.XMLHTTP) //ie5 6
}
request.onreadystatechange=function(){// 状态发生变化时，函数被回调
if(request.readyState===4){// 成功完成
// 判断响应结果:
if(request.status===200){
// 成功，通过responseText拿到响应的文本:
return success(request.responseText);
}else{
// 失败，根据响应码判断失败原因:
return fail(request.status);
}
}else{
// HTTP请求还在继续...
}
}
// 发送请求:
//第一个参数请求方式
第二个参数url请求链接
第三个参数 是否异步
request.open("POST","url",true);
request.setRequestHeader("Content-type","application/x-www-form-urlencoded"); //必须写在open和send中间
request.send("name=悟空&age=29");