Heim > Web-Frontend > js-Tutorial > Hauptteil

Wie verwende ich Ajax?

PHP中文网
Freigeben: 2017-06-21 10:16:10
Original
1173 Leute haben es durchsucht

Lassen Sie uns heute über Ajax sprechen, es gibt nicht viel zu sagen; gehen Sie einfach zum Code!

//将数据转换成 a=1&b=2格式;
function json2url(json){
   var arr = [];
   //加随机数  防止缓存;
   json.t = Math.random();
   for(var name in json){
      arr.push(name+'='+json[name]);
   }
   return arr.join('&');
}

function ajax(json){
   //考虑前台默认值:
   if(!json.url){
      alert('请输入合理的请求地址!');
      return;
   }
   json.type = json.type || 'get';
   json.time = json.time || 5000;
   json.data = json.data || {};
      //1.创建一个ajax对象;
      var timer = null;
   if(window.XMLHttpRequest){
      var oAjax = new XMLHttpRequest();
   }else{
      var oAjax = new ActiveXObject('Microsoft.XMLHTTP');
   }
   
   //判断用户传递的是get还是post请求:
   switch (json.type.toLowerCase()){
      case 'get':
         //2.打开请求;
         oAjax.open('get',json.url+'?'+json2url(json.data),true);
         //3.发送数据:
         oAjax.send();
         break;
      case 'post':
         //打开请求;
         oAjax.open('post',json.url,true);
         //设置请求头;
         oAjax.setRequestHeader('Content-type','application/x-www-form-urlencoded');
         //发送数据;
         oAjax.send(json2url(json.data));
         break;
   }
    json.fnLoading && json.fnLoading();
   //4.获取响应数据
   oAjax.onreadystatechange = function(){
      if (oAjax.readyState == 4) {
      	json.complete && json.complete();
         if (oAjax.status >= 200 && oAjax.status < 300 || oAjax.status == 304) {
            //如果外边传递了成功的回调函数,那么就执行,
            json.success && json.success(oAjax.responseText);
         } else {
            //如果外边传递了失败的回调函数,那么就执行,
            json.error && json.error(oAjax.status);
         }
         clearTimeout(timer);//规定时间内取到数据后清除定时器;
      }
   };
   var timer;
   timer = setTimeout(function(){//设置网络响应超时;
      alert(&#39;网络响应超时,请稍后再试&#39;);
      oAjax.onreadystatechange = null;//网络超时后清除事件;
   },json.time);
};
Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonWie verwende ich Ajax?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage