首页 > 网站 > WEB开发 > 正文

异步对象(XMLHttpRequest)的帮助脚本

2024-04-27 14:16:37
字体:
来源:转载
供稿:网友

异步对象(xmlHttPRequest)的帮助脚本

异步对象五部曲

这是post请求的、

 //1.00创建异步对象            var xhr = new xmlhttpRequest();            //2.0            xhr.open("post", url,params, true);            //3.0将参数使用Formdata属性传递            xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");            //4.0设置回调函数            xhr.onreadystatechange = function () {                if (xhr.readyState == 4 && xhr.status == 200) {                    alert(xhr.responseText);                }            }            //5.0传递参数            xhr.send(params);

结合get请求做一个异步对象的封装

get 请求中的

  xhr.setRequestHeader("If-Modified-Since", "0"); 是为了清除缓存而post请求的
 xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");是为了传输方式在<from method='post' type=""><from>中的type可以得到三种方式,其中包括application/x-www-form-urlencoded

var AjaxHelp = {    CreatXHR: function () {        //创建异步对象        var xhr = new XMLHttpRequest();        return xhr;    },    //ajax的get请求    AjaxGet: function (url, callBack) {        this.AJaxCommon("get", url, null, callBack);    },    //ajax的post请求    AjaxPost: function (url, params, callBack) {        this.AJaxCommon("post", url, params, callBack);    },    AJaxCommon: function (method, url, params, callBack) {        //1.0        var xhr = this.CreatXHR();        //2.0        xhr.open(method, url, true);        //3.0        if (method == "get") {            xhr.setRequestHeader("If-Modified-Since", "0");        } else {            xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");        }        //4.0        xhr.onreadystatechange = function () {            if (xhr.readyState == 4 && xhr.status == 200) {                var datas = JSON.parse(xhr.responseText);                //执行回调函数                callBack(datas);            }        }        //5.0        xhr.send(params);    }};

ps:在JQuery里面是有$.ajax 和$.get / $.Post 等异步请求的方法的。以前的封装就不用了。额。好扯。其实他们底层也是这样的写的呢。JQuery就是为了解决各个浏览器的兼容性问题而已


发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表