`

Ajax:基础的通信方式

 
阅读更多

Sky = {};

/*
url-loading object and a request queue built on top of it
*/
Sky.Ajax = function (paramObj) {//url, onload, onerror, method, params, contentType) {
	this.req = null;
	this.onload = paramObj.onload || function(){};
	this.onerror = (paramObj.onerror) ? paramObj.onerror : this.defaultError;
	this.url = paramObj.url;
	this.method = paramObj.method;
	this.params = paramObj.params;
	this.contentType = paramObj.contentType;
	this.sendRequest(paramObj.url, paramObj.method, paramObj.params, paramObj.contentType);
};

Sky.Ajax.READY_STATE_UNINITIALIZED = 0;
Sky.Ajax.READY_STATE_LOADING = 1;
Sky.Ajax.READY_STATE_LOADED = 2;
Sky.Ajax.READY_STATE_INTERACTIVE = 3;
Sky.Ajax.READY_STATE_COMPLETE = 4;

Sky.Ajax.prototype.reload = function() {
	this.sendRequest(this.url, this.method, this.params, this.contentType);
};

Sky.Ajax.prototype.sendRequest = function (url, method, params, contentType) {
	method = method || "GET";
	if (!contentType && method == "POST") {
		contentType = "application/x-www-form-urlencoded";
	}
	if (window.XMLHttpRequest) {
		this.req = new XMLHttpRequest();
	} else {
		if (window.ActiveXObject) {
			this.req = new ActiveXObject("Microsoft.XMLHTTP");
		}
	}
	if (this.req) {
		try {
			var loader = this;
			this.req.onreadystatechange = function () {
				Sky.Ajax.onReadyState.call(loader);
			};
			this.req.open(method, url, true);
			if (contentType) {
				this.req.setRequestHeader("Content-Type", contentType);
			}
			this.req.send(params);
		}
		catch (err) {
			this.onerror.call(this);
		}
	}
};

Sky.Ajax.onReadyState = function () {
	var req = this.req;
	var ready = req.readyState;
	
	if (ready == Sky.Ajax.READY_STATE_COMPLETE) {
		var httpStatus = req.status;
		if (httpStatus == 200 || httpStatus == 0) {
			this.onload.call(this, req.responseText);
		} else {
			this.onerror.call(this);
		}
	}
};

Sky.Ajax.prototype.defaultError = function () {
	alert("error fetching data!" + "\n\nreadyState:" + this.req.readyState + "\nstatus: " + this.req.status + "\nheaders: " + this.req.getAllResponseHeaders());
};
 
分享到:
评论

相关推荐

    Ajax基础教程(扫描版)

    第3章 与服务器通信:发送请求和处理响应 37 3.1 处理服务器响应 37 3.1.1 使用innerhtml属性创建动态内容 37 3.1.2 将响应解析为xml 40 3.1.3 使用w3c dom动态编辑页面 45 3.2 发送请求参数 52 3.2.1 请求...

    Ajax-Basics:AJAX通信处理的基础。 通过PHP和JS之间的异步通信计算字符数

    我试图用JQuery在Ajax中实现异步通信的基础。 使用JQuery有一些遗留问题,但我不后悔将其作为SPA的基础。 评论文章: :

    MSDN Webcast - ASP.NET AJAX深入浅出系列课程(12):Microsoft AJAX Library中异步通信层的扩展

    讲座内容: Microsoft AJAX Library为了便于开发AJAX应用提出了一个异步通信层,它是整个ASP.NET AJAX客户端AJAX请求的基础。事实上,我们能够基于这个通信平台进行轻松的扩展,使它能够支持不同的通信方式。这节...

    Ajax.基础教程

    通过 AJAX,您的 JavaScript 可使用 JavaScript 的 XMLHttpRequest 对象来直接与服务器进行通信。通过这个对象,您的 JavaScript 可在不重载页面的情况与 Web 服务器交换数据。 AJAX 在浏览器与 Web 服务器之间使用...

    AJAX基础教程及实例

    通过AJAX,您的JavaScript可使用JavaScript的XMLHttpRequest对象来直接与服务器进行通信。通过这个对象,您的JavaScript可在不重载页面的情况与Web服务器交换数据。AJAX在浏览器与Web服务器之间使用异步数据传输...

    Ajax基础教程.AJAX入门

    第1章 Ajax简介 第2章 使用XMLHttpRequest对象 第3章 与服务器通信:发送请求和处理响应 第4章 实现基本Ajax技术 第5章 构建完备的Ajax开发工具箱 第6章 使用JsUnit测试JavaScript代码

    尚硅谷_Ajax

    现在,允许浏览器与服务器通信而无须刷新当前页面的技术都被叫做Ajax. “Ajax”这个名字是在2005年2月,Adaptive Path的Jesse James Garrett在他的文章Ajax:A New Approach to Web Application中创造。 而Ajax这项...

    Ajax详解.rar

    Ajax 由 HTML、JavaScript™ 技术、DHTML 和 DOM 组成,...1.4 与服务器端组件进行通信 175 1.5 从客户机调用服务 178 1.6 服务器端验证的需要 179 1.7 用 JSNI 调用本机 JavaScript 181 1.8 为什么使用 GWT? 183

    Ajax基础教程(正式版)

    ajax基础教程,非常适用于初学者。教程分为六章,包括使用XMLHttpRequest对象,与服务器通信:发送请求和处理响应,实现基本Ajax 技术等

    Ajax完全自学手册(源代码).rar

    第4章 DOM基础及高级DOM技术 柳州龙腾.xml XML-无限数据传输 Test4Document.htm 访问DOM对象的相关节点 Test4Document.htm 检测节点类型 Test4Attribute.htm 节点的属性解析 get&setAttribute.htm 节点的...

    Boa服务器下的ajax与cgi通信

    课程实验给的例子是直接使用printf来打印html标签形成新的页面,有过前端开发经验的人都知道这种做法效率低下而且没有办法实现异步刷新,所以博主采用ajax来进行boa服务器下的异步通信。 主要实现及踩过的坑如下: ...

    MSDN Webcast - ASP.NET AJAX深入浅出系列课程(14):Profile Service的实现方式与扩展(Level 300) (ID:1032351378)

    讲座内容: Profie 是ASP.NET 2.0的重要特性之一,而ASP.NET AJAX提出了Profile Service,使开发人员能够方便地在客户端以AJAX的方式来处理Profile信息。这节课我们将来了解这个ProfileService简单的功能细节以及...

    毕设项目:基于springboot+mysql+ajax的网上借阅系统前端及后台.zip

    【资源介绍】 毕设项目:基于springboot+mysql+ajax的网上借阅系统前端及后台.zip毕设项目:基于...基础能力强的可以在此基础上修改调整,以实现不同的功能。 欢迎下载,欢迎沟通,互相学习,共同进步!提供答疑!

    Ajax完全自学手册(PPT)

    第4章 DOM基础及高级DOM技术 柳州龙腾.xml XML-无限数据传输 Test4Document.htm 访问DOM对象的相关节点 Test4Document.htm 检测节点类型 Test4Attribute.htm 节点的属性解析 get&setAttribute.htm 节点的...

    AJAX基础概念、核心技术与典型案例(内涵动态实例)

    利用Ajax可以通过使用滑块的滑动来选择所显示的分页,这种拖拽的方式有很好的用户体验。 /test.html 滑动显示分页页面 /js JavaScript脚本文件 /img 系统使用的图片文件夹 第22章(/ch22) ...

    ASP.NET和AJAX简洁教程

    幸运的是,ASP.NET AJAX提供了一种有效的基础架构来做这件事情,浏览器和服务器在Internet上可以进行AJAX通信。自然而然,Web Service在数据传输和客户端/服务器之间的一般通信方面可以扮演一个重要角色。本文就演示...

    [ASP.NET.AJAX编程参考手册(涵盖ASP.NET.3.5及2.0)].(美)霍斯拉维.扫描版.pdf

    通过大量的实例,本书详述了AJAX的内部机制,并且紧跟时代潮流,重点描述了如何依靠异步通信机制,更快、更好、更有效地实现客户端和服务器端之间的通信。 作者简介 Shahram Khosravi,博士。他是一名资深的软件...

    ajax基础教程

    ajax教程,包含ajax简介、XMLHttpRequst对象、与服务器的通信、甚至包括javascript代码编写的技巧测试

    Ajax完全手册part2

    第1~第4章为第一部分,分别讲解了Ajax技术的基本概念、JavaScript通信技术、XMLHttpRequest对象和数据格式;第5~9章为第二部分,在YUI的基础上创建了AjaxTCR库,并在随后的章节中详细讨论了信息传输中的网络因素、...

    Ajax完全手册part1

    第1~第4章为第一部分,分别讲解了Ajax技术的基本概念、JavaScript通信技术、XMLHttpRequest对象和数据格式;第5~9章为第二部分,在YUI的基础上创建了AjaxTCR库,并在随后的章节中详细讨论了信息传输中的网络因素、...

Global site tag (gtag.js) - Google Analytics