`
xtiawxf
  • 浏览: 16579 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

自定义ajax调用功能

阅读更多
由于公司未采用任何一套js框架,使用ajax方式调用很是郁闷,就自己搞了个来调用:
var xmlHttpRequest;
// 创建XMLHttpRequest对象,在各个浏览器上,该对象的名称及创建方法不一样
function createXMLHttpRequest() {
	var xmlHttp;
	if (window.XMLHttpRequest) {
		// Firefox Exproler
		xmlHttp = new XMLHttpRequest();
		/*设置MiME类别
		**    其作用是:针对某些特定版本的mozillar浏览器的BUG进行修正
		**    具体来说:如果来自服务器的响应没有 XML mime-type 头部,则一些版本的 Mozilla 浏览器不能正常运行。
		**	 对于这种情况,httpRequest.overrideMimeType('text/xml'); 语句将覆盖发送给服务器的头部,强制 text/xml 作为 mime-type。
		*/
		if (xmlHttp.overrideMimeType){
			xmlHttp.overrideMimeType("text/xml"); 
		}
	} else if (window.ActiveXObject) {
		// Internet Exproler
		try {
			xmlHttp =  new ActiveXObject("Msxml2.XMLHTTP");
		} catch (e) {
			xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
		}
	}
	return xmlHttp;
};
if( typeof window.ZHY == 'undefined') {
    ZHY = {};
}
ZJH = {
	url:"",
	//固定全大写,固定将参数转成大写
	type:"GET",
	async:true,
	data:"",
	//暂时未使用,返回值取纯文本
	dataType:"text",
	returnData:null,
	init:function(obj){
		if(obj.url == null || typeof obj.url == 'undefined')return false;
		this.url = obj.url;
		if(!(obj.type == null || typeof obj.type == 'undefined')){
			this.type = obj.type.toUpperCase();
        	}
        	if(!(obj.async == null || typeof obj.async == 'undefined')){
        		this.async = obj.async;
        	}
        	this.data="";
        	if(!(obj.data==null || typeof obj.data=='undefined')){        		
        		//将json格式数据转换为ajax可以传递参数的格式
	        	for(var key in obj.data){
     	   		var param = obj.data[key];
        			//如果参数是数组,则需要进一步解析
        			if(Object.prototype.toString.call(param)=="[object Array]"){
        				for(var value in param){
        					this.data += "&"+key+"="+value
        				}
	        		}else this.data += "&"+key+"="+param;
     	   	}
        		if(this.data.length>1)this.data = this.data.substr(1);
	    	}
        	if(!(obj.success == null || typeof obj.success == 'undefined')){
        		this.success = obj.success;
        	}
        	if(!(obj.error == null || typeof obj.error == 'undefined')){
        		this.error = obj.error;
        	}
        	if(this.type=="GET"){
        		if(this.data!=""){
        			this.url += (this.url.indexOf("?")==-1?"?":"&") + this.data;
        		}
        		//if(this.url.indexOf("?")==-1)this.url += "?" + this.data;
			//else	this.url += "&" + this.data;
        	}
        	
        	return true;
	},
    callback : function() {
		if(xmlHttpRequest.readyState == 4) {
			if(xmlHttpRequest.status == 200) {
				var success = ZHY.success;
				success(xmlHttpRequest.responseText,xmlHttpRequest.status)
			}else{
				var error = ZHY.error;
				error(xmlHttpRequest,xmlHttpRequest.status)
			}
		}
    },
    success : function(data,textStatus){    		
    },
    error : function(textStatus, errorThrown){
    },
    // 发送Ajax请求
    /*
    **obj对象属性说明如下:
    **async:默认true异步传输处理;false为同步处理,将锁住页面,等请求完成后才能继续操作
    **url	:请求地址,必须指定
    **data:请求参数:json格式
    **type:发送请求方式:Post/Get,默认Get
    **dataType:预期服务器返回的数据类型。默认"text",可选值如下:
    **	"xml": 返回 XML 文档,可用 jQuery 处理。
	**	"html": 返回纯文本 HTML 信息;包含的script标签会在插入dom时执行。
	**	"script": 返回纯文本 JavaScript 代码。不会自动缓存结果。除非设置了"cache"参数。'''注意:'''在远程请求时(不在同一个域下),所有POST请求都将转为GET请求。(因为将使用DOM的script标签来加载)
	**	"json": 返回 JSON 数据 。
	**	"jsonp": JSONP 格式。使用 JSONP 形式调用函数时,如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名,以执行回调函数。
	**	"text": 返回纯文本字符串
    **success:请求成功后的回调函数
    **error:请求失败时调用此函数
    */
    ajax : function(obj) {
		if(xmlHttpRequest == null || typeof xmlHttpRequest == 'undefined') {
          	xmlHttpRequest = createXMLHttpRequest();
		}
		this.init(obj);
        //var url = "/"+Sys_PATH + "/" +Sys_CURDB2+"/agGetTeamInfobyTeam?openagent&key=系统分析与质控组&rnd="+Math.random();
        	xmlHttpRequest.open(this.type, this.url, this.async); 
		xmlHttpRequest.onreadystatechange = this.callback;	
        	if(this.type=="GET"){
        		xmlHttpRequest.send(null);
		}else{
			//定义传输的文件HTTP头信息  
			xmlHttpRequest.setRequestHeader("content-length",this.data.length);
			xmlHttpRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded");  
			//发送POST数据  
			xmlHttpRequest.send(this.data);
		}		
    }
};

调用方式如下:
ZJH.ajax({
		url:url,
		data:{"key":key,"curPage":curPage,"pageSize":pageSize,"rnd":Math.random()},
		type:"Get",
		success:function(data){
                  }
	});
分享到:
评论

相关推荐

    自定义Ajax.NET出发方式和指定调用服务器端函数 C#实例

    的客户端触发方式(onclick,onmouseover,onkeydown...),和调用任意的服务器端自定义函数。 而微软的Ajax.net似乎只能使用服务器控件的很少的事件,最常用的就是Button的onclick事件, 而服务器端的函数也似乎只能是...

    自定义Ajax框架,struts框架的模拟,特效代码

    在实际应用中,自定义Ajax框架可能与模拟Struts框架结合,例如,通过Ajax请求调用Struts的Action,这样可以在不刷新页面的情况下更新内容,提供更好的用户体验。 至于“特效代码”,这可能指的是用来增强用户界面的...

    自定义AJAX对话框

    在网页开发中,自定义AJAX对话框是一种常见的交互设计技术,它允许用户与服务器进行异步通信,而无需刷新整个页面。这种技术极大地提升了用户体验,因为它使得数据的加载和处理更加流畅,减少了用户等待时间。本文将...

    jQuery使用Ajax方法调用WebService

    在.NET中,你可以创建一个ASMX文件来定义你的服务方法,然后在jQuery的Ajax调用中引用这些方法。 在调用过程中,需要注意的是跨域问题。由于同源策略的限制,Ajax请求通常只能访问同源(协议+域名+端口)的资源。...

    如何操作ajax调用

    ### 如何操作Ajax调用:深入理解与实践 在现代Web开发中,异步JavaScript和XML(Ajax)技术被广泛应用于实现网页的异步数据交互,使得用户可以在不刷新整个页面的情况下,动态地获取和更新数据。本文将深入探讨如何...

    使用XMLHTTPRequest实现自定义ajax。javascript闭包模式写法。值的学习

    最后,`ajax.net`标签可能是指ASP.NET AJAX库,这是一个微软提供的用于构建异步Web应用程序的框架,它扩展了ASP.NET的功能,支持客户端脚本和服务器端代码的无缝集成。不过,这里的讨论主要聚焦于基本的...

    MVCAJAX用JQUERY调用实例例子

    在本文中,我们将深入探讨如何在MV(Model-View-Controller)架构中使用JQuery进行AJAX调用,以及如何处理JSON返回值。这通常在Web应用开发中用于实现无刷新的数据交互,提高用户体验。 首先,让我们理解MVC模式。...

    jquery 自定义方法调用示例

    在给定的示例中,可能包含了一个HTML文件(1.html)用于展示页面结构,一个JavaScript文件(2.js)用于定义和调用自定义方法,以及一个jQuery库的压缩文件(jquery-1.4.2.min.js),确保了页面可以使用jQuery功能。...

    ajax联动

    通过理解并熟练运用Ajax控件和自定义Ajax调用,开发者能够提升应用程序的性能和用户体验。在实际项目中,深入学习和实践"AjaxTest"中的示例,将有助于更好地理解和掌握Ajax在ASP.NET 2.0中的应用。

    jQuery Ajax调用Web服务代码

    结合以上三个概念,"jQuery Ajax调用Web服务代码"通常是指使用jQuery的Ajax方法来与Web服务进行通信。以下是一个基本示例: ```javascript $.ajax({ url: 'http://example.com/webservice', // Web服务的URL type...

    ajax.net异步调用

    除了 UpdatePanel,ASP.NET AJAX 还支持自定义服务端脚本、使用 PageMethods 和 WebServices 进行异步调用。这些方法更加灵活,但需要手动处理 JavaScript 和响应。 - **PageMethods**:在页面中声明静态方法,然后...

    源代码-AJAX类,调用方式类似jQuery.zip

    【标题】中的“源代码-AJAX类,调用方式类似jQuery”暗示了这是一个关于JavaScript编程的资源,特别是与AJAX(异步JavaScript和XML)技术相关,而且其设计风格和使用方法受到了jQuery库的启发。在AJAX的帮助下,...

    ajaxX调用C#方法

    在Web开发中,异步...这种自定义实现可能简化了传统Ajax调用的复杂性,提高了开发效率,并且提供了更灵活的前后端交互方式。通过阅读提供的文档和测试案例,开发者可以快速上手并利用AjaxX进行高效的Web开发。

    JSP中使用EXT实现grid table

    它支持分页、排序、过滤和自定义列功能,还可以与其他EXT组件(如表格)无缝集成。EXT Grid的核心特性包括: 1. 数据绑定:EXT Grid可以与服务器端的数据源进行双向绑定,这得益于EXT JS的数据模型和Store机制。...

    ajax调用服务

    首先,jQuery的`$.ajax()`函数是核心的Ajax调用方法。它允许我们设置多种参数来定制请求,如URL、请求类型(GET或POST)、数据类型(JSON、XML、HTML等)以及回调函数等。例如,一个简单的Ajax调用可以这样写: ```...

    jQuery和CSS3通过AJAX调用切换页面过渡动画特效

    "jQuery和CSS3通过AJAX调用切换页面过渡动画特效"正是这样一款插件,它巧妙地融合了jQuery库、CSS3技术和AJAX,为网页切换提供了无缝且动感十足的效果。 **jQuery库的应用** jQuery是一个轻量级的JavaScript库,...

    ajax跨域调用wcf实例--改分重传

    在提供的“AjaxWcfServiceKuayu123”文件中,可能包含了创建和调用这种跨域WCF服务的示例代码,包括服务端的WCF配置和服务接口实现,以及客户端的Ajax调用代码。通过学习和理解这些代码,开发者可以掌握如何在实际...

    ajax跨域调用wcf实例

    它可以支持多种协议,包括HTTP,使服务可以被AJAX调用。在WCF中实现跨域调用,我们需要配置服务以允许来自不同源的请求。 以下是实现AJAX跨域调用WCF服务的具体步骤和相关知识点: 1. **开启WCF服务的跨域支持**:...

    AJAX自定义控件 验证用户(C#)

    在本文中,我们将深入探讨如何使用C#语言和ASP.NET技术来创建一个AJAX自定义控件,以实现用户输入的验证功能。这个控件的主要目的是简化文本框的验证过程,提供一种动态、异步的方式来检查用户输入的有效性,从而...

Global site tag (gtag.js) - Google Analytics