欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

原生js封裝的ajax方法示例

 更新時(shí)間:2018年08月02日 12:13:18   作者:Manson_zh  
這篇文章主要介紹了原生js封裝的ajax方法,結(jié)合實(shí)例形式分析了JavaScript封裝ajax操作及調(diào)用方法相關(guān)操作技巧,非常簡(jiǎn)單實(shí)用,需要的朋友可以參考下

本文實(shí)例講述了原生js封裝的ajax方法。分享給大家供大家參考,具體如下:

眾所周知,框架之間會(huì)有沖突,這是源生js就起到作用了,下面介紹一種源生js封裝的ajax請(qǐng)求。

function ajax(options) {
  options = options || {};
  options.type = (options.type || "GET").toUpperCase();
  options.dataType = options.dataType || "json";
  var params = formatParams(options.data);
  //創(chuàng)建xhr對(duì)象 - 非IE6
  if (window.XMLHttpRequest) {
    var xhr = new XMLHttpRequest();
  } else { //IE6及其以下版本瀏覽器
    var xhr = new ActiveXObject('Microsoft.XMLHTTP');
  }
  //GET POST 兩種請(qǐng)求方式
  if (options.type == "GET") {
    xhr.open("GET", options.url + "?" + params, true);
    xhr.send(null);
  } else if (options.type == "POST") {
    xhr.open("POST", options.url, true);
    //設(shè)置表單提交時(shí)的內(nèi)容類型
    xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
    xhr.send(params);
  }
  //接收
  xhr.onreadystatechange = function () {
    if (xhr.readyState == 4) {
      var status = xhr.status;
      if (status >= 200 && status < 300) {
        options.success && options.success(xhr.responseText);
      } else {
        options.fail && options.fail(status);
      }
    }
  }
}
//格式化參數(shù)
function formatParams(data) {
  var arr = [];
  for (var name in data) {
    arr.push(encodeURIComponent(name) + "=" + encodeURIComponent(data[name]));
  }
  arr.push(("v=" + Math.random()).replace(".",""));
  return arr.join("&");
}

調(diào)用方法

ajax({
  url: "data.json",
  type: "GET",
  data: {},
  dataType: "json",
  success: function (response) {
    // 此處放成功后執(zhí)行的代碼
     // 解析返回的字符串 轉(zhuǎn)為json對(duì)象
    var usingdata = eval("("+response+")").data;
  }
  fail: function (status) {
    // 此處放失敗后執(zhí)行的代碼
  }
});

更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題:《JavaScript中ajax操作技巧總結(jié)》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)

希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。

相關(guān)文章

最新評(píng)論