ajax全称是：asynchronous javasctipt and xml。
1.为什么需要ajax？
一般web程序与服务器的交互是：页面发送请求等待服务器处理，服务器处理数据，用户页面刷新整个页面，从而完成了一次交互。
如果用这种同步方式进行多次这种页面与服务器的交互，用户将会需要很多时间去等待服务器处理。
ajax异步处理的思想是：当页面发送请求后，交给服务器处理，服务器处理的同时，页面无须等待可以进行其他的操作，当服务器处理完成后，在当前页面显示结果，无须刷新整个页面。
2.ajax的简单实现
实现ajax需要用到javascript的XMLHttpRequest对象。
实现过程
1）创建对象（不同浏览器有不同的创建方法，一般需要考虑ie和非ie浏览器）
ie浏览器要用到ActiveXObject。
非ie浏览器可直接新建XMLHttpRequest对象实例。
2）发送请求。
发送请求前需要先建立一个与服务器的连接。它需要的参数有发送类型、连接的url、异步连接状态值等。
> 发送类型：GET/POST等。
> url：连接地址 + ？ + 传送的值 （+ & + 传送的值..） [这里是用的get方式]
> 异步连接状态值：true / false。默认为true。true表示异步连接。
在发送请求前还要建立一个返回函数，它是用来指定服务器响应后要执行的内容。
发送请求。
3）服务器响应函数
3.一个简单实例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script>
//var xmlHttp = new XMLHttpRequest();
/*创建XMLHttpRequest对象*/
var xmlHttp = false;
/*@cc_on @*/ //ie条件编译
/*@if (@_javascript_version >= 5)
try{
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
}catch(e){
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}catch(e2){
xmlHttp = false;
}
@end @*/
if(!xmlHttp && typeof XMLHttpRequest != 'undefined'){
xmlHttp = new XMLHttpRequest();
}
function callServer(){
//获取name和password值
var name = document.getElementById("name").value;
var password = document.getElementById("password").value;
//判断name和password是否为空
if((name == "null") || (name == "")) return ;
if(password == "null" || password == "") return ;
//创建要连接的url
var url = "check.php?name=" + escape(name) + "&password" + escape(password);
//建立一个服务器的连接
xmlHttp.open("GET", url, true);
//创建服务器完成后运行的函数
xmlHttp.onreadystatechange = updatePage;
//发送请求
xmlHttp.send(null);
}
function updatePage(){
if(xmlHttp.readyState == 4){ //http就绪状态
if(xmlHttp.status == 200){ //判断http状态码
<span style="white-space:pre"> </span>//处理服务器响应
var response = xmlHttp.responseText;
document.getElementById("ajax-result").value = response;
}else if(xmlHttp.status == 404){
alert("Request url does not exist!");
}else{
alert("ERROR:status code is" + xmlHttp.status);
}
}
}
</script>
</head>
<body>
<div id="form">
<form method="get">
name:<input type="text" id="name" onchange="callServer()"/><br>
passwiord:<input type="text" id="password" onchange="callServer()"><br>
result:<input type="text" id="ajax-result"/>
</form>
</div>
</body>
</html>
[ajax 学习笔记] ajax初试,布布扣,bubuko.com
原文：http://blog.csdn.net/monkey7777/article/details/38315057