一步一步学ajax(一)
曾经对ajax很好奇,每次和同学或者同事谈起ajax听他们在那轻描淡写一番不知所以然,前几天查资料才豁然明白。下面直入正题:
Ajax 基本上就是把 JavaScript 技术和 XMLHttpRequest
对象放在 Web
表单和服务器之间
。当用户填写表单时,数据发送给一些 JavaScript 代码而不是
直接发送给服务器。相反,JavaScript
代码捕获表单数据并向服务器发送请求。同时用户屏幕上的表单也不会闪烁、消失或延迟。换句话说,JavaScript
代码在幕后发送请求,用户甚至不知道请求的发出。更好的是,请求是异步发送的,就是说 JavaScript
代码(和用户)不用等待服务器的响应。因此用户可以继续输入数据、滚动屏幕和使用应用程序。然后,服务器将数据返回 JavaScript 代码(仍然在 Web
表单中),后者决定如何处理这些数据。它可以迅速更新表单数据,让人感觉应用程序是立即完成的,表单没有提交或刷新而用户得到了新数据。JavaScript
代码甚至可以对收到的数据执行某种计算,再发送另一个请求,完全不需要用户干预!这就是 XMLHttpRequest
的强大之处。它可以根据需要自行与服务器进行交互,用户甚至可以完全不知道幕后发生的一切。结果就是类似于桌面应用程序的动态、快速响应、高交互性的体验,但是背后又拥有互联网的全部强大力量。
以上解释中提到XMLHttpRequest,对,ajax正是靠XMLHttpRequest发送ajax请求。先看代码
/* Create a new XMLHttpRequest object to talk to the Web server */
var xmlHttp = false;
/*@cc_on @*/
/*@if (@_jscript_version >= 5)
try {
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e2) {
xmlHttp = false;
}
}
@end @*/
if (!xmlHttp && typeof XMLHttpRequest != 'undefined') {
xmlHttp = new XMLHttpRequest();
}
这段代码的核心分为三步:
建立一个变量 xmlHttp
来引用即将创建的 XMLHttpRequest
对象。
尝试在 Microsoft 浏览器中创建该对象:
尝试使用 Msxml2.XMLHTTP
对象创建它。
如果失败,再尝试 Microsoft.XMLHTTP
对象。
如果仍然没有建立 xmlHttp
,则以非 Microsoft 的方式创建该对象。
最后,xmlHttp
应该引用一个有效的 XMLHttpRequest
对象,无论运行什么样的浏览器。
二、XMLHttpRequest对象已经
相关文档:
//用户名校验的方法
//这个方法将使用XMLHTTPRequest对象来进行AJAX的异步数据交互
var xmlhttp;
function verify() {
//0。使用dom的方式获取文本框中的值
//document.getElementById("userName")是dom中获取元素节点的一种方法,一个元素节点对应HTML页面中的一个标签,如果<input& ......
PopupControl扩展器控件可以附加到任何控件之上,当用户点击该控件时,将弹出一个预先指定好的、显示附加信息或用来帮助用户执行某些设定的Panel。当该控件失去输入焦点之后,Panel将自动消失,且用户在其中进行的配置将被设定到扩展器的目标控件之上。
实 ......
11月21日晚7点应邀在武汉大学信息学院做了一场关于ASP.NET下AJAX开发的报告,以我自己经历讲述了一些特殊应用在过去到现在实现手段的变化,本来想回家之后做个总结的,但是由于最近以来事情一直很多,所以没有来得及总结。今晚得以有空总结一下。
AJAX介绍
其实AJAX应用的核 ......
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>JavaScript Sample</title>
<link rel="stylesheet" type="text/css" href="main.css" media="all">
<sc ......