很早以前,我在自己做项目的时候就使用过Ajax技术,但是当时对于其机制就是搞部清楚,所以也都是复用人家写的东西。所以当时也只是知道了Ajax这个东西,和Ajax可以给我的Web编程带来的好处罢了。今天,我在新的公司,由于需求的要求,必须使用Ajax,经过几天的实践,终于对Ajax又有了新的了解。虽然现在有很多人都使用prototype,里面也很好的封装了Ajax,但是对于部分项目而言(特别是那种很早以前就开始了,但是确永远做不完的项目,比如公司自产自用的ERP),没有必要每次去加载这么一个35KB左右的文件(毕竟效率上会受影响)。所以公司决定自己写。代码如下:
定义
varXMLHttpReq=false;

/**//*-------------------------------------Ajax基础函数-------------------------------------*/
//建立XMLHttpRequest对象
functionCreateXMLHttpRequest()

...{
if(window.XMLHttpRequest)

...{
//IsMozillaBrowse
XMLHttpReq=newXMLHttpRequest();
}
elseif(window.ActiveXObject)

...{
//IEBrowse
try

...{

XMLHttpReq=newActiveXObject("Msxml2.XMLHTTP");
}
catch(e)

...{
try

...{

XMLHttpReq=newActiveXObject("Microsoft.XMLHTTP");
}

catch(e)...{}
}
}
}

//Sendrequest'function.(POST)
//Url:sendurladdress.
//IsWait:Iswaittingorreturnnow.
//ResponseFunction:processresponse'sfunction.
//XmlObj:sendxmldataobject.
functionSendRequestPost(Url,IsWait,ResponseFunction,XmlObj)

...{
CreateXMLHttpRequest();
XMLHttpReq.open("POST",Url,IsWait);
XMLHttpReq.onreadystatechange=ResponseFunction;//defineresponse'sfunction
XMLHttpReq.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
XMLHttpReq.send(XmlObj);//SendRequest
}

//Sendrequest'function.(GET)
//Url:sendurladdress.
//IsWait:Iswaittingorreturnnow.
//ResponseFunction:processresponse'sfunction.
//ArgString:sendurl'sargumentstring.
functionSendRequestGet(Url,IsWait,ResponseFunction,ArgString)

...{
CreateXMLHttpRequest();
XMLHttpReq.onreadystatechange=ResponseFunction;//defineresponse'sfunction
if(ArgString==null)

...{
XMLHttpReq.open("GET",Url,IsWait);
}
else

...{
XMLHttpReq.open("GET",Url+"?"+ArgString,IsWait);
}
XMLHttpReq.send(null);
}

//Invokefunction.
//SendType:sendtype.(GETorPOST)
//UrlPath:sendurladdress.
//IsWait:Iswaittingorreturnnow.(trueorfalse)
//DataType:sendargument'sdatatype.(DataMailorDataWork)
//ResponseFunction:processresponse'sfunction.
functionRunSend(SendType,UrlPath,IsWait,DataType,ResponseFunction)

...{
varurl=unescape(UrlPath.replace(/+/g,""));
vardataobj=CreateData(DataType);
if(SendType=="POST")

...{
SendRequestPost(url,IsWait,ResponseFunction,dataobj);
}
elseif(SendType=="GET")

...{
SendRequestGet(url,IsWait,ResponseFunction,dataobj);
}
}
以后每次调用RunSend函数,SendType传入“POST”或者“GET”,UrlPath为Ajax获取页面地址,IsWait为是否等待请求,DataType为处理数据类型,ResponseFunction为响应函数。
//Creatdataobject.
functionCreateData(DataClassType)

...{
vardataObj="";
switch(DataClassType)

...{
case"MailPage":
dataObj=CreateMailPage();
break;
}
returndataObj;
}
functionf()

...{
if(XMLHttpReq.readyState==4)

...{
//judgementobjectstate
if(XMLHttpReq.status==200)

...{
alert("Ajax");
}
}
}
functionCreateMailPage()

...{
vardataObj="DataType=MailPage&page=1“;
returndataObj;
}
然后调用
RunSend( "GET",url,true,"MailPage",f );
就可以了
分享到:
相关推荐
这部分内容对于刚接触Ajax的读者来说非常重要,因为它不仅介绍了Ajax的基本概念,还概述了Ajax技术的组成元素,如HTML、JavaScript、DHTML和DOM等。 #### Ajax核心技术详解 - **使用JavaScript和Ajax发出异步请求*...
标题 "网易云音乐一键签到、打卡听歌300首源码" 涉及的是一个使用PHP编写的程序,旨在帮助用户自动完成网易云音乐的每日签到任务,并可能包括连续听歌300首的打卡功能。这个源码可能是通过模拟用户行为来与网易云...
4. **AJAX**:异步JavaScript和XML,用于不刷新页面的情况下更新内容。 5. **JSON**:轻量级的数据交换格式,常用于服务器与客户端之间的数据传输。 学生在完成这个课程设计时,不仅需要理解这三个核心技术,还需要...
曾为国内首本jQuery权威教程,一版再版,累计重印14次,不可错过的实战类经典技术著作! jQuery API网站的维护者亲自撰写 作为最新升级版,本书涵盖jQuery 1.10.x和jQuery 2.0.x。本书前6章以通俗易懂的方式讲解了...
ExtJS是一个强大的JavaScript库,专门用于构建富客户端的AJAX应用程序,即RIA(Rich Internet Applications)。它与后端技术无关,可以配合.Net、Java、PHP等多种开发语言,提供丰富的用户界面。ExtJS最初基于YUI库...
在这个项目中,我们主要会接触到以下几个关键知识点: 1. ASP.NET基础:ASP.NET是Microsoft开发的一个用于构建Web应用程序的框架,它允许开发者使用.NET Framework的多种编程语言(如C#、VB.NET)来创建动态网页。...
例如,可以使用`<nav>`创建导航菜单,`<ul>`和`<li>`构建列表项,`<audio>`标签用于嵌入音频播放功能,而`<button>`则用于控制播放、暂停、上一首、下一首等操作。 此外,为了实现更丰富的交互效果,我们还会涉及到...
唯品会作为中国知名的在线折扣零售平台,其登录页面是用户接触平台的第一步,因此在用户体验、安全性以及功能实现上都有着严格的要求。本文将深入探讨唯品会登录页面的设计理念以及背后的技术实现。 1. 用户界面...
作为微软最新的SaaS应用案例,Crab用到了大部分微软一些最新的技术,如:用 Asp.net ajax 1.0、web parts、themes对页面View进行优化,用WCF(Windows Communication Foundation)对Services进行封装,用WF(Windows ...
登录页面作为用户接触系统的首站,设计时需要考虑到用户体验、安全性、易用性和品牌一致性。 【标签】"JavaScript" 表示这个项目主要使用JavaScript编程语言进行开发。JavaScript是Web开发中的关键技术,用于实现...
随着前端框架的发展,JavaScript的重要性日益凸显,你可能会接触到React、Vue或Angular等流行的框架,了解它们如何简化开发流程。 除此之外,"灯塔网络笔记"也会涉及到Web性能优化。Lighthouse审计涵盖了首屏加载...
由于登陆页面是用户与应用的第一接触点,因此JavaScript的运用至关重要,它可以帮助开发者创建引人入胜的视觉效果,同时保持页面的响应性和可访问性。 首先,JavaScript可以用来创建动态登陆表单。例如,它可以实时...
为了存储和管理数据,项目可能会使用AJAX(Asynchronous JavaScript and XML)进行异步通信,向服务器请求数据或发送用户数据。尽管现代Web应用更倾向于使用Fetch API或axios等库,但核心思想是相同的:在不刷新页面...
这个功能可能会有多个子页面,如商品列表、商品详情和库存统计,需要前端与后端的紧密协作,利用AJAX进行异步数据更新,提供流畅的用户体验。 个人中心通常包含了用户的个人信息、设置选项以及交易记录等。这部分的...
在这个过程中,学生或爱好者会接触到网站开发的基础概念,如HTML、CSS和PHP等技术。 【描述】"我的第一个网站"的描述暗示了这个项目可能是关于网页设计和开发的学习过程。在建立一个网站时,首先需要理解网站的基本...