ajax到底该如何使用?
程序员文章站
2022-04-30 17:38:42
...
今天来说一下ajax,话不多说;直接上代码!
//将数据转换成 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('网络响应超时,请稍后再试'); oAjax.onreadystatechange = null;//网络超时后清除事件; },json.time); };
以上就是ajax到底该如何使用?的详细内容,更多请关注其它相关文章!