我期待已久的AJAX今天终于迎来了第一天(感觉特别高兴)
废话不多说
Ajax的核心是JavaScript对象XmlHttpRequest。该对象在Internet Explorer 5中首次引入,它是一种支持异步请求的技术。简而言之,XmlHttpRequest使您可以使用JavaScript向服务器提出请求并处理响应,而不阻塞用户。
Ajax对服务器没什么要求,可以为Java EE应用程序,.NET应用程序和其他类型的应用程序服务。可以通过Ajax,可以编写javascript代码来改进HTML,创建出丰富的交互性用户体验。
这些介绍感觉还是比较难懂,依我理解(当然是第一次接触的感觉) AJAX的作用就是用JS 进行后台调用 就是 用JS可以与后台进行数据交互,有一点本人特别喜欢,就是AJAX对后台进行数据交互,是局部的 ,前台看不到有任何回传现象,当然它也没有回传。
OK ,现在来说一下怎么写AJAX
在JS中下以下代码
//创建全局XmlHttpRequest变量
var XmlHttp;
//定义创建XmlHttpRequest的方法
function createXmlHttp()
{
//判断是否是IE浏览器使用(抱怨一句: 本人觉的如今浏览器各种各样,让我们web程序员特别无奈,为什么就不能统一一下呢?)
if (window.ActiveXObject) {
//如果是IE则要通过ActiveXObject创建
XmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
} else {
XmlHttp = new XMLHttpRequest();
}
//创建要调用的方法(比如button的onclick的点击事件)
function seach()
{
//执行创建XmlHttpRequest的方法
createXmlHttp();
//给XmlHttpRequest方法设置一个回掉方法(方法名是mychage,当然这是自己取的名字)
XmlHttp.onreadystatechange = mychage;
//获取需要的参数(比如按钮点击要提交 一个文本框的值)
var name = document.getElementById("txtName").value;
//设置XmlHttpRequest的Open方法,三个参数(目前好像有5个参数,不过凡是VS提示参数有【】抱起来的参数是可给可不给的),第一个参事回传方式(post,或者 get),第二个参数是要执行的后台的代码,一般是用过滤器,也就是Handler类(一般处理程序),第三个参一般给true(本人也不是太了解 )
XmlHttp.open("GET", "Handler.ashx?content=" + name, true);
//设置XmlHttpRequest的头setRequestHeader这句代码是死的(本人一般是Copy,因为太难记了)
XmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
//调用send方法,send方法里的参其实就是你要给后台类的参,当然也可以在Open方法里用Url传参
XmlHttp.send();
}
//回调方法
function mychage()
{
//判断后台是否成功响应这次请求XmlHttp.readyState详解(点击打开链接)XmlHttp.status详解(点击打开链接)
if (XmlHttp.readyState == 4 && XmlHttp.status == 200) {
//获取后台返回的数据responseText是文本值 还可以是responseXml等等
var dom = XmlHttp.responseText;
//拿到值以后就是完成一次后台,前台的数据交互了
}
}
这就是AJAX的原理,当然这只是很基础的,AJAX的作用远远不止这些。
AJAX的魅力确实很大,感觉自己对AJAX的好奇越来越大了
本人是第一次写博客,还有很多不足,如有写错的地方希望大家积极指出,让我知道自己的错在哪里,及时改正。(谢谢)
好了也不早了睡觉去