這篇文章主要介紹了js如何實(shí)現(xiàn)簡單實(shí)用的AJAX，具有一定借鑒價(jià)值，感興趣的朋友可以參考下，希望大家閱讀完這篇文章之后大有收獲，下面讓小編帶著大家一起了解一下。

目前成都創(chuàng)新互聯(lián)公司已為近1000家的企業(yè)提供了網(wǎng)站建設(shè)、域名、網(wǎng)絡(luò)空間、網(wǎng)站托管運(yùn)營、企業(yè)網(wǎng)站設(shè)計(jì)、根河網(wǎng)站維護(hù)等服務(wù)，公司將堅(jiān)持客戶導(dǎo)向、應(yīng)用為本的策略，正道將秉承"和諧、參與、激情"的文化，與客戶和合作伙伴齊心協(xié)力一起成長，共同發(fā)展。

JS是什么

JS是JavaScript的簡稱，它是一種直譯式的腳本語言，其解釋器被稱為JavaScript引擎，是瀏覽器的一部分，主要用于web的開發(fā)，可以給網(wǎng)站添加各種各樣的動(dòng)態(tài)效果，讓網(wǎng)頁更加美觀。

具體如下：

//版權(quán)歸屬 WUJXPING
//ajax 1.2
//更新2012-2-20
//1、異步數(shù)據(jù)加載可以進(jìn)行加載方式get,post的設(shè)定
//2、異步同步模式的屬性設(shè)定
//3、數(shù)據(jù)加載自動(dòng)超時(shí)設(shè)置
//4、***數(shù)據(jù)加載事件的添加，通過事件可以進(jìn)行服務(wù)器數(shù)據(jù)的實(shí)時(shí)處理
//5、增加回調(diào)函數(shù)中用戶自定義參數(shù)this.e
//6、增加ajax反復(fù)提交控制，只需將ajax對(duì)象定義為全局變量，每次提交都會(huì)進(jìn)行等待上次提交的執(zhí)行結(jié)果
//7、修改數(shù)據(jù)反復(fù)提交時(shí)XmlHttp對(duì)象被反復(fù)創(chuàng)建的問題
//8、修復(fù)重大BUG，多個(gè)AJAX事件覆蓋問題
//服務(wù)器數(shù)據(jù)返回事件
ajax.prototype.ServerEven=function(Func){
  this.callback=new delegate(Func);//實(shí)例化
}
//創(chuàng)建異步處理對(duì)象
ajax.prototype.CreateXMLHttp=function(){
  if(this.XmlHttp!=null && typeof this.XmlHttp == "object")
    return this.XmlHttp;
  xmlhttpObj = ["Microsoft.XmlHttp","MSXML2.XmlHttp.5.0","MSXML2.XmlHttp.4.0","MSXML2.XmlHttp.3.0","MSXML2.XmlHttp"];
 //根據(jù)不同的瀏覽器創(chuàng)建XMLHttpRequest
 if(window.ActiveXObject){
   for(i=0;i<xmlhttpObj.length;i++){ //選擇ie兼容版本
      try{
        this.XmlHttp = new ActiveXObject(xmlhttpObj[i]);
      }catch(err){
        continue;
      }
      if(this.XmlHttp)
        break;
    }
 }
 else if(window.XMLHttpRequest){
  this.XmlHttp=new XMLHttpRequest();
 }
  return this.XmlHttp;
 }
 //開始調(diào)用
ajax.prototype.Send=function(){
  if(this.isbusy)//ajax正忙
    return;
  this.isbusy=true;
 var xmlhtml=this.CreateXMLHttp(); //創(chuàng)建對(duì)象
  if(xmlhtml==null){
    this.isbusy=false
    if(this.callback!=null)
      this.callback.run("XMLHttpRequest Create Faild!",this.e);
    return;
  }
  var url=this.url;
  var _this=this;
  // 加隨機(jī)數(shù)防止緩存
  if (url.indexOf("?") > 0)
    url += "&randnum=" + Math.random();
  else
    url += "?randnum=" + Math.random();
  xmlhtml.open(this.method,url,this.async);
 xmlhtml.setRequestHeader("Content-Type","application/x-www-form-urlencoded;charset=utf-8;");
  xmlhtml.setRequestHeader("Cache-Control","no-cache");
 xmlhtml.setRequestHeader("Connection","Keep-Alive");
  //開啟定時(shí)進(jìn)行超時(shí)等待
  var timer=setTimeout(function(){
    //if(xmlhtml.readyState!=4){
    xmlhtml.abort(); //取消本次傳輸
    _this.isbusy=false;
    if(_this.callback!=null)
      _this.callback.run("send timeout!",_this.e);
    clearTimeout(timer); //關(guān)閉定時(shí)器
  },this.timeout);
  if(this.async)//異步數(shù)據(jù)加載時(shí)狀態(tài)變化與事件掛鉤
    xmlhtml.onreadystatechange=function(){//接收服務(wù)器響應(yīng)
      if(xmlhtml.readyState==4){//判斷是否是完成狀態(tài)
        if(xmlhtml.status==200){ //判斷是否執(zhí)行成功
          _this.isbusy=false;
          clearTimeout(timer); //關(guān)閉定時(shí)器
          if(_this.callback!=null)//開始觸發(fā)服務(wù)器事件
            _this.callback.run(xmlhtml,_this.e);
        }
      }
    };
  try{
    xmlhtml.send(this.option);
  }catch(err){
    this.isbusy=false
    clearTimeout(timer); //關(guān)閉定時(shí)器
    alert(err);
    return;
  }
  if(!this.async){//同步數(shù)據(jù)加載時(shí)數(shù)據(jù)返回處理
    this.isbusy=false;
    clearTimeout(timer); //關(guān)閉定時(shí)器
    if(this.callback!=null)
      this.callback.run(xmlhtml,this.e);
  }
 }
 //創(chuàng)建ajax對(duì)象
function ajax(url){
  this.method="post";//設(shè)置數(shù)據(jù)提交方式
  this.async=true;//是否進(jìn)行異步數(shù)據(jù)加載模式
  this.option="";  //請求的參數(shù)
  this.url=url;//請求的Url連接
  this.timeout=1000*60*1;//默認(rèn)超時(shí)時(shí)間為1分鐘
  this.e=null;//回調(diào)事件中用戶自定義參數(shù)
  this.XmlHttp=null;//接收異步創(chuàng)建的對(duì)象防止反復(fù)創(chuàng)建
  this.isbusy=false//獲取當(dāng)前ajax的執(zhí)行狀態(tài)
  this.callback=null;//聲明回調(diào)事件
  // 實(shí)現(xiàn)委托的類
  delegate=function (func){
   this.arr = new Array(); // 回調(diào)函數(shù)數(shù)組
   this.add = function(func){
    this.arr[this.arr.length] = func;
   };
   this.run = function(sender,e){
    for(var i=0;i<this.arr.length;i++){
     var func = this.arr[i];
     if(typeof func == "function"){
      func(sender,e); // 遍歷所有方法以及調(diào)用
     }
    }
   }
   this.add(func);
  }
}

感謝你能夠認(rèn)真閱讀完這篇文章，希望小編分享的“js如何實(shí)現(xiàn)簡單實(shí)用的AJAX”這篇文章對(duì)大家有幫助，同時(shí)也希望大家多多支持創(chuàng)新互聯(lián)，關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，更多相關(guān)知識(shí)等著你來學(xué)習(xí)!

當(dāng)前題目：js如何實(shí)現(xiàn)簡單實(shí)用的AJAX
文章源于：http://aaarwkj.com/article6/pjccig.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供ChatGPT、網(wǎng)頁設(shè)計(jì)公司、商城網(wǎng)站、定制網(wǎng)站、做網(wǎng)站、品牌網(wǎng)站制作

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)