AJAX学习感想

前面做项目的时候老师也跟我们提过AJAX,是一个可以实现局部刷新的技术,现在很流行.今天老师给我们具体的讲了一下,用一句话说so easy!呵呵!今天做了个例子,是实现了一个简单的数据校验,就是验证用户名和密码的.不用刷新页面就可以提交的.真的是so easy!
下面是JS代码:
<script type="text/javascript">
var abc;
function sendData(){
var name = document.getElementById("userName");
var pwd = document.getElementById("pwd");
var nameValue =name.value;
var pwdValue = pwd.value;
var serverUrl = "servlet/AjaxServlet";
abc = getAjaxObject();
abc.onreadystatechange = showAbc;
abc.open("get",serverUrl+"?a="+nameValue+"&b="+pwdValue,true);
abc.send();
var buttonObj = document.getElementById("buttonId");
buttonObj.disabled = true;
var msgObj = document.getElementById("msg");
msgObj.innerHTML = "数据正在处理中，请稍侯...";
}

function showAbc(){
//当服务器将数据返回给客户端时,readyState状态值为4
if(abc.readyState==4){
//当服务器返回的数据是正常的数据时,status状态值为200
if(abc.status==200){
var buttonObj = document.getElementById("buttonId");
buttonObj.disabled = false;
var msgObj = document.getElementById("msg");
msgObj.innerHTML = "";
//通过XMLHttpRequest对象的responseText属性获取
//服务器返回的文本信息
var returnMsg = abc.responseText;
msgObj.innerHTML = returnMsg;
//showMessage(returnMsg);
}
}
}

function getAjaxObject(){
var xmlHttpRequest;
if(window.XMLHttpRequest){//Mozilla,IE7.0
xmlHttpRequest = new XMLHttpRequest();
if(xmlHttpRequest.overrideMimeType){
xmlHttpRequest.overrideMimeType("text/xml");
}
}else if(window.ActiveXObject){//IE
try{
xmlHttpRequest = new ActiveXObject("Msxml2.XMLHTTP");
}catch(e){
try{
xmlHttpRequest = new ActiveXObject("Microsoft.XMLHTTP");
}catch(e){}
}
}
return xmlHttpRequest;
}


</script>


这里是HTML代码
<div id="msg"></div>
<form method="get">
<p>
 
<input type="text" id="userName" name="userName">
</p>
<br>
<p>
<input type="password" id="pwd" name="pwd">
</p>
<p>
<input id="buttonId" type="button" value="登陆" name="button1" οnclick="sendData();">
<br>
</p>
</form>