首页 > 代码库 > js实现jq的ajax
js实现jq的ajax
本文将介绍如何使用js封装一段代码,实现jq的ajax功能,每一步代码均有注释便于理解
实现代码
function ajax(){ //获取ajax的相应值(请求类型,请求地址,同步或异步,传递数据,接收数据类型,成功失败函数等) var ajaxData =http://www.mamicode.com/ { type:arguments[0].type || "GET", url:arguments[0].url || "", async:arguments[0].async || "true", data:arguments[0].data || null, dataType:arguments[0].dataType || "text", contentType:arguments[0].contentType || "application/x-www-form-urlencoded", beforeSend:arguments[0].beforeSend || function(){}, success:arguments[0].success || function(){}, error:arguments[0].error || function(){} } ajaxData.beforeSend() var xhr = createxmlHttpRequest(); //创建 XMLHttpRequest 对象 xhr.responseType=ajaxData.dataType; //预期服务器返回的数据类型 xhr.open(ajaxData.type,ajaxData.url,ajaxData.async); //规定请求的类型、URL 以及是否异步处理请求 xhr.setRequestHeader("Content-Type",ajaxData.contentType); //发送信息至服务器时内容编码类型(向请求添加 HTTP 头) xhr.send(convertData(ajaxData.data)); //将请求发送到服务器 //当请求被发送到服务器时,我们需要执行一些基于响应的任务。 //每当 readyState 改变时,就会触发 onreadystatechange 事件。 //readyState 属性存有 XMLHttpRequest 的状态信息。 xhr.onreadystatechange = function() { if (xhr.readyState == 4) { if(xhr.status == 200){ ajaxData.success(xhr.response) }else{ ajaxData.error() } } } } //创建 XMLHttpRequest 对象 function createxmlHttpRequest() { if (window.ActiveXObject) { // IE6, IE5 浏览器执行代码 return new ActiveXObject("Microsoft.XMLHTTP"); } else if (window.XMLHttpRequest) { // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码 return new XMLHttpRequest(); } } //解析传入的对象 function convertData(data){ if( typeof data =http://www.mamicode.com/== ‘object‘ ){ var convertResult = "" ; for(var c in data){ convertResult+= c + "=" + data[c] + "&"; } convertResult=convertResult.substring(0,convertResult.length-1) return convertResult; }else{ return data; } }
调用方法
ajax({ type:"POST", url:"ajax.php", dataType:"json", data:{"val1":"abc","val2":123,"val3":"456"}, beforeSend:function(){ //some js code }, success:function(msg){ console.log(msg) }, error:function(){ console.log("error") } })
js实现jq的ajax
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。