一. Javascript实现Ajax
function btnClick() {
//创建访问服务器的对象(只对IE有效)
var xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
//准备请求open(请求方式GET/POST,请求地址,是否异步)
xmlHttp.open("GET", "GetTime.ashx", false);
//注册请求状态改变的事件
xmlHttp.onreadystatechange = function () {
//如果请求成功
if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
//获得请求返回的数据
var str = xmlHttp.responseText;
//显示
alert(str);
}
}
//发送请求
xmlHttp.send();
}
这里需要注意:
1.缓存问题
xmlHttp.open("GET", "GetTime.ashx", false);
如果请求方式是GET,会存在缓存问题,如果请求方式是POST,一般不会存在缓存问题。为了在两种请求方式下都能够避免缓存问题,可用下面的代码
xmlHttp.open("POST", "Handler1.ashx?sm=" + new Date(), false);
在请求地址中将的当前时间作为参数,参数不同即url不同,也就避免了缓存的问题。
如果传递非中文参数
xmlHttp.open("POST", "Handler1.ashx?param=China", false);
如果传递中文参数
xmlHttp.open("POST", "Handler1.ashx?param=" + encodeURI("中国"), false);
二. JQuery 实现Ajax
上面使用Javascript实现Ajax有许多需要注意的地方,且代码量大,相比之下,JQuery就要简单得多。
function btnClick2() {
// post(请求地址,请求完成后客户端执行的方法(返回的数据,请求的状态));
$.post("GetTime.ashx", function (data, status) {
if (status == "success") {
alert(data);
}
});
}
当然也有$.get()方法
对于参数问题,将不用再考虑中文的问题
//在post方法中的第二个位置可以加入参数,参数是以键值对的形式传入,{key1:value1,key2:value2,...}
$.post("Handler1.ashx", { "param": "中国" }, function (data, status) {
alert(data);
});