ASP.NET之AJAX系列(三)
首先在上一篇也提到过,Ajax是异步的Javascript和XML,那么聪明的你应该已经猜到,js脚本是必不可少的。我们在这里先引入一个浏览器对象:XMLHttpRequest,可能大家对这个对象比较陌生,那么我们就先从它的属性开始了解。它主要有三个属性:onreadystatechange 属性、readyState 属性和responseText 属性,从名字上我们大致可以看出,第一个属性,也就是onreadystatechange 是用来在状态变更的时候处理服务器响应的函数,第二个属性是保存服务器响应的状态(如常见的200 OK,404 Not Found等等),第三个属性是获取服务器响应后的信息。
介绍完三个属性之后,我们开始进入正题,和所有的过程一样,我们需要先初始化XMLHttpRequest这个对象,但是由于浏览器的问题,在不同的浏览器初始化时,需要进行不同的方式:
<script type="text/javascript">
var xmlhttp;
function checkUser() {
xmlhttp = null;
var Name = document.getElementById("txtId").value;
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
}//这里适用于火狐,谷歌还有高版本IE浏览器
else if (window.ActiveXObject) {
xmlhttp = new ActiveXObject("Microsoft.XMLHttp");
}//这里适用于低版本IE,如IE4,IE5等等
xmlhttp.open("GET", "Handler1.ashx?name=" + Name, true);
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4) {
if (xmlhttp.status == 200) {
document.getElementById("lblShow").innerHTML = xmlhttp.responseText;
}
}
}
xmlhttp.send(null);
}
</script>
从代码中我们再一次验证了微软当年的“不走寻常路”,说句题外话,做了这么久的B/S,发现兼容性真是个头疼的问题,尤其是IE,每个版本之间兼容性都不一致,写Js的时候苦不堪言,推荐使用JQuery,它的兼容性非!常!好!在初始化对象之后,我们便开始了发送请求之旅,这次我们依然是向ashx提交并进行处理。xmlhttp.open("GET", "Handler1.ashx?name=" + Name, true);这句代码中有3个参数,第一个参数用于指定get提交或是post提交,这里需要注意大写;第二个参数是要提交的url,第三个参数指定是否为异步模式。接下来我们需要处理服务端状态改变后的函数,先判断服务器响应的状态信息:0为请求未初始化(在调用 open() 之前),1为请求已提出(调用 send() 之前),2为请求已发送(这里通常可以从响应得到内容头部),3为请求处理中(响应中通常有部分数据可用,但是服务器还没有完成响应),4为请求已完成(可以访问服务器响应并使用它)。
上一篇: 早饭是啥
下一篇: 如何使用修补工具修复图像(去水印)
推荐阅读
-
最佳实践系列(四)-- PHP 安全三板斧:过滤、验证和转义之验证篇 & Laravel底层字段验证实现
-
ASP.NET之AJAX系列(三)
-
学习ASP.NET Core Razor 编程系列三——创建数据表及创建项目基本页面
-
菜鸟蔡之Ajax复习第三篇(Ajax之无刷新登录)
-
Asp.Net Core轻松学习系列之配置文件
-
ASP.NET之MVC 微信公众号授权给第三方平台的技术实现流程一(获取第三方平台access_token)...
-
ASP.Net Core MVC基础系列之服务注册和管道
-
前端工程师技能之photoshop巧用系列第三篇——切图篇
-
在ASP.NET 2.0中操作数据之四十四:DataList和Repeater数据排序(三)
-
利用ASP.NET MVC+Bootstrap搭建个人博客之打造清新分页Helper(三)