前端之家收集整理的这篇文章主要介绍了
Ajax Zero to Hero (2)入门代码的简单封装，
前端之家小编觉得挺不错的，现在分享给大家，也给大家做个参考。
<pre name="code" class="html"><!DOCTYPE html>
<html>
<head>
<Meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<script type="text/javascript">
/*
url:请求服务器的地址
method:请求方法("GET","POST")
params:请求参数(格式类似 "fname=Bill&lname=GATE")
*/
function ajaxSubmit(url,method,params){
if(window.XMLHttpRequest){
xmlhttp = new XMLHttpRequest();
}else{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
//xmlhttp.onreadystatechange=ajaxCallbackProcess();这种写法是把ajaxCallbackProcess函数调用之后的结果
//赋给xmlhttp.onreadystatechange,而不是把ajaxCallbackProcess函数对象本身赋给xmlhttp.onreadystatechange
//而xmlhttp.onreadystatechange期待的值是函数对象本身而不是函数调用的值,大坑....折磨我2天....
xmlhttp.onreadystatechange=ajaxCallbackProcess;//回调函数
xmlhttp.open(method,url,true);
xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
xmlhttp.send(params);
}
function ajaxCallbackProcess(){//回调函数
window.alert(xmlhttp.readyState);
window.alert(xmlhttp.status);
window.alert(xmlhttp.statusText);
if(xmlhttp.readyState==4 && xmlhttp.status ==200){
window.alert("回调函数");
document.getElementById("username").value =xmlhttp.responseText;
}
}
</script>
</body>
<input type="button" name="diawo" value="发送ajax请求" onclick='ajaxSubmit("TestAjaxServlet","POST","fname=Bill&lname=GATE");'>
<input type="text" name="username" id="username">
</html>注意:
xmlhttp.onreadystatechange=ajaxCallbackProcess();这种写法是把ajaxCallbackProcess函数调用之后的结果
赋给xmlhttp.onreadystatechange,而不是把ajaxCallbackProcess函数对象本身赋给xmlhttp.onreadystatechange
而xmlhttp.onreadystatechange期待的值是函数对象本身而不是函数调用的值,大坑....折磨我2天....
xmlhttp.onreadystatechange=ajaxCallbackProcess;//正确写法
原文链接：https://www.f2er.com/ajax/162023.html
