原生js的AJAX
和jQuery的$.ajax()的效果是一样一样哒!
//原生AJAX var fxAJAX = function (el) { //el :初始化 参数 //get请求方式会产生缓存,post请求方式则没有。。。 var el = { url: el.url,//必填 type: el.type == undefined ? "get" : el.type,//string 可选,默认为"get" data: el.data == undefined ? null : el.data,//可选,默认为空,只有type==post请求的的时候需要, user=user&name=name.... dataType: el.dataType == undefined ? "text" : el.dataType,//string 可选,默认为“text” success: el.success//可选,回调函数 }; //创建XMLHttpRequest对象 var xmlHttp = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP"); //传参数,打开对象 xmlHttp.open(el.type, el.url, true); //选择发送方式 //因为get请求的参数是在url里,所以send(null); el.type.toString().toLocaleLowerCase() == "get" ? xmlHttp.send(null) : xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); xmlHttp.send(el.data); //if (el.type.toString().toLocaleLowerCase() == "get") { xmlHttp.send(null) } else { xmlHttp.send(el.data) } xmlHttp.onreadystatechange = function () { if (xmlHttp.readyState == 4 && xmlHttp.status == 200) { if (el.dataType.toString().toUpperCase() == "TEXT") { //普通文本 if (el.success != null) { el.success(xmlHttp.responseText); } } else if (el.dataType.toString().toUpperCase() == "XML") { //接收xml文档 if (el.success != null) { el.success(xmlHttp.responseXML); } } else if (el.dataType.toString().toUpperCase() == "JSON") { //将josn字符串转换为js对象 if (el.success != null) { el.success(eval("(" + xmlHttp.responseText + ")")); } } } } }
如何调用?
fxAJAX({ url: "?action=del", type: "post", data: "Id=" + id, success: function (msg) {//执行成功之后运行到这里 //console.log(‘成功‘)! } });
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。