/**
* AJAX工具
*/
/**
* 获取请求对象
*/
function createXMLHttpRequest(){
try {
// 大多数浏览器支持
return new XMLHttpRequest();
} catch (e) {
try {
// IE6.0支持
return new ActiveXObject("Msxml2:XMLHTTP");
} catch (e) {
try {
// IE5.5以之前版本支持
return new ActiveXObject("Microsoft:XMLHTTP");
} catch (e) {
alert("对不起,您的浏览器不支持!");
throw e;
}
}
}
}
/**
* 发送ajax请求
* 参数格式为JSON
* 提交方式:method,GET/POST,默认GET
* 请求地址:url
* 是否异步:sync,true/false,默认true
* 请求参数:params,默认为null
* 回调函数:callback
* 返回的参数类型type:text,xml,json,默认text
*/
function ajax(option){
// 提交方式默认GET
// alert(option.method);
if(option.method == undefined){
option.method = "GET";
}
// 默认异步
if(option.sync == undefined){
option.sync = true;
}
// 默认返回字符串
if(option.type == undefined){
option.type = "text";
}
// 创建请求对象
var xmlHttp=createXMLHttpRequest();
// 建立连接
xmlHttp.open(option.method,option.url,option.sync);
// POST设置消息头
if(option.method == "POST"){
xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
}
// 发送请求
xmlHttp.send(option.params);
// 设置响应回调
xmlHttp.onreadystatechange=function(){
if(xmlHttp.readyState == 4 && xmlHttp.status == 200){
var data;
if(option.type=="text"){
data=xmlHttp.reponseText;
}else if(option.type == "json"){
var text=xmlHttp.responseText;
data=eval("("+text+")");
}else if(option.type == "xml"){
data=xmlHttp.responseXML;
}
// 执行回调处理数据
option.callback(data);
}
}
}
调用ajax发送异步消息:
<script type="text/javascript" src="./js/ajax.js"></script>
<script type="text/javascript">
window.onload=function(){
var but=document.getElementById("but");
but.onclick=function(){
ajax({
url:"/learn_ajax/HelloServlet",
type:"json",
callback:function(data){
var value=data.name+","+data.age+","+data.marry;
document.getElementById("h1").innerHTML=value;
}
});
}
};
</script>