AJAX技术入门指导
什么是 AJAX?
AJAX (异步 JavaScript 和 XML) 是个新产生的术语,专为描述JavaScript的两项强大性能.这两项性能在多年来一直被网络开发者所忽略,直到最近Gmail, Google suggest和google Maps的横空出世才使人们开始意识到其重要性.
这两项被忽视的性能是:
无需重新装载整个页面便能向服务器发送请求.
对XML文档的解析和处理.
步骤 1 – "请!" --- 如何发送一个HTTP请求
为了用JavaScript向服务器发送一个HTTP请求, 需要一个具备这种功能的类实例. 这样的类首先由Internet Explorer以ActiveX对象引入, 被称为XMLHTTP. 后来Mozilla, Safari 和其他浏览器纷纷仿效, 提供了XMLHttpRequest类,它支持微软的ActiveX对象所提供的方法和属性.
因此, 为了创建一个跨浏览器的这样的类实例(对象), 可以应用如下代码:
if (window.XMLHttpRequest) { // Mozilla, Safari, ...
http_request = new XMLHttpRequest();
} else if (window.ActiveXObject) { // IE
http_request = new ActiveXObject("Microsoft.XMLHTTP");
}
(上例对代码做了一定简化,这是为了解释如何创建XMLHTTP类实例. 实际的代码实例可参阅本篇步骤3.)
如果服务器的响应没有XML mime-type header,某些Mozilla浏览器可能无法正常工作. 为了解决这个问题, 如果服务器响应的header不是text/xml,可以调用其它方法修改该header.
http_request = new XMLHttpRequest();
http_request.overrideMimeType('text/xml');
接下来要决定当收到服务器的响应后,需要做什么.这需要告诉HTTP请求对象用哪一个JavaScript函数处理这个响应.可以将对象的onreadystatechange属性设置为要使用的JavaScript的函数名,如下所示:
http_request.onreadystatechange = nameOfTheFunction;
注意:在函数名后没有括号,也无需传递参数.另外还有一种方法,可以在扉页(fly)中定义函数及其对响应要采取的行为,如下所示:
http_request.onreadystatechange = function(){
// do the thing
};
在定义了如何处理响应后,就要发送请求了.可以调用HTTP请求类的open()和send()方法, 如下所示:
http_request.open('GET', 'http://www.example.org/some.file', true);
http_request.send(null);
open()的第一个参数是HTTP请求方式 – GET, POST, HEAD 或任何服务器所支持的您想调用的方式. 按照H
相关文档:
通过理解错误的编码方式,可以更好地了解如何正确地进行编码。当然,编写 Asynchronous JavaScript™ +
XML(Ajax)有正确的方法,也有错误的方法。本文将讨论一些需要避免的常见编码实践。
如果人们在第一次就能够将所有事情全部做对,那么这个世界将变得完全不同。Ajax 也是如此。我做了大量的工作以支持 Ajax
......
ajax的功能主要是应用在js上,ajax对asp没什么要求,asp只负责在后台显示及操作服务端的数据。
可以像下面这样思考:
1.写表单第一项(如用户名)
2.onblur事件(失去焦点)发生时开始验证,onblur="checkusername()"
3.js发一个请求给第一个asp(假定为ajaxusername.asp)如果从数据库中找到了这个用户,给出1(ajaxuse ......
XMLHttpRequest 对象使 AJAX 成为可能。
XMLHttpRequest
XMLHttpRequest 对象是 AJAX 的关键。
该对象在 Internet Explorer 5.5 与 2000 年 7 月发布之后就已经可用了,但是在 2005 人们开始讨论 AJAX 和 Web 2.0 之前,这个对象并没有得到充分的认识。
创建 XMLHttpRequest 对象
不同的浏览器使用不同的方法来创建 ......
load(url[,data][,callback])------------->通常用来从WEB服务器上获取静态的数据文件
url: string类型 请求HTML页面的URL地址
data(可选): object 发送至服务器的key/value数据
callback(可选):function 请求完成时回调函数
例子:
主页面代码:
<style type="text/css">
* { margin:0; padding ......