简单的ajax封装-php手册-php.cn

简单的ajax封装

WBOY

Release： 2016-06-07 11:44:26

Original

1033 people have browsed it

简单的原生javascript ajax情趣方法
我怎么总是上床不了附件。。。
是不是有时候只想简单的利用一下ajax功能，而不像引入jquery呢，这时候这个东西可以帮你
这个是简单版本没有加入时间超时限制，用法和jquery的get post 相似

供大家参考/** * 简单的ajax封装方法默认返回 html * @Author yulipu * @version 1.0 * * @param receiveType 返回数据类型 * 参数取值 html xml json * 用法 * function demo() { * var xmlhttp = new simpleYAjax('html'); //不填参数默认就是html * xmlhttp.post('ajax.php', 'name=张三', function(s) { * document.getElementById('conDiv').innerHTML = s; * }); * * var xmlhttp = new simpleYAjax('json'); //不填参数默认就是html * xmlhttp.get('ajax.php?param=1', function(json) { * alert(json.xxx); * }); * } * */ function simpleYAjax(receiveType) { var self = this; //一个变量定义了但没赋值则值为undefined //typeof 后面若是一个没有定义过的变量则值为 undefined 若是定义过但没赋值的变量值也是undefined this.receiveType = (undefined == receiveType ? 'html' : receiveType); this.callBack = null; //回调函数 this.xmlhttp = this.init(); //xmlHttpRequest对象 //把服务器返回数据传给回调函数 this.processCallBack = function() { if(self.xmlhttp.readyState == 4) { if(200 == self.xmlhttp.status || 0 == self.xmlhttp.status) { // 0是没经过服务器 if(self.receiveType == 'html') { self.callBack(self.xmlhttp.responseText); //调用回调函数 } else if(self.receiveType == 'xml') { self.callBack(self.xmlhttp.responseXML); } else if(self.receiveType == 'json') { try { self.callBack(JSON.parse(self.xmlhttp.responseText)); } catch(e) { var str = '(' + self.xmlhttp.responseText + ')'; //json字符串 self.callBack(eval(str)); } } else { //others } } } }; } /** * 初始化xmlHttpRequest对象 */ simpleYajax.prototype.init = function() { var xmlhttp = null; //需要针对不同轮浏览器建立这个对象的不同方式写不同代码 if (window.XMLHttpRequest) { //针对FireFox、Mozillar、Opera、Safari、IE7、IE8 xmlhttp = new XMLHttpRequest(); //针对某些特定版本的Mozillar浏览器的BUG进行修正 if (xmlhttp.overrideMimeType) { xmlhttp.overrideMimeType("text/xml"); } } else if (window.ActiveXObject) { //针对IE6、IE5.5、IE5 //IE中创建XMLHttpRequest对象要用到对象的控件名，例如： //var xmlhttp = new ActiveXObject("控件名"); //可用的控件名有：MSXML2.XMLHTTP, Microsoft.XMLHTTP //我们用一个for循环来让他自己判断用哪个控件名可以创建出XMLHttpRequest对象 var activexName = ['MSXML2.XMLHTTP', 'Microsoft.XMLHTTP']; for (var i=0; i<activexname.length></activexname.length> try { //取出一个控件名进行创建，如果成功就结束循环 //如果创建失败就抛出异常，不做处理，让他继循环尝试创建 xmlhttp = new ActiveXObject(activexName[i]); break; } catch(e) {} } } return xmlhttp; }; /** * post方式发送请求 * @param targetUrl 服务端地址 * @data 发送的数据 * @callBack 回调函数回调函数接收一个参数,就是服务器端返回的结果 */ simpleYajax.prototype.post = function(targetUrl, data, callBack) { if(callBack) { //typeof 后面是函数则结果是'function' this.callBack = callBack; this.xmlhttp.onreadystatechange = this.processCallBack; this.xmlhttp.open('POST', targetUrl, true); //打开与服务器连接 this.xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); //post方式要设置请求类型 this.xmlhttp.send(data); //发送内容到服务器 } }; /** * get方式发送请求 * @param targetUrl 服务端地址 * @callBack 回调函数回调函数接收一个参数,就是服务器端返回的结果 */ simpleYajax.prototype.get = function(targetUrl, callBack) { if(callBack) { this.callBack = callBack; this.xmlhttp.onreadystatechange = this.processCallBack; //注册回调函数 processCallBack把内容处理后回传给callBack //if(window.XMLHttpRequest) { this.xmlhttp.open('GET', targetUrl); this.xmlhttp.send(null); //} else { // this.xmlhttp.open('GET', targetUrl, true); // this.xmlhttp.send(); //} } };

AD：真正免费，域名+虚机+企业邮箱=0元