zoukankan      html  css  js  c++  java
  • 原生封装的ajax

    原生封装的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){

       //1.创建一个ajax对象;

       if(window.XMLHttpRequest){

          var oAjax = new XMLHttpRequest();

       }else{

          var oAjax = new ActiveXObject('Microsoft.XMLHTTP');

       }

       //考虑默认值:

       if(!json.url){

          alert('请输入合理的请求地址!');

          return;

       }

       json.type = json.type || 'get';

       json.time = json.time || 5000;

       json.data = json.data || {};

       //判断用户传递的是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));

       }

       //4.获取响应数据

       oAjax.onreadystatechange = function() {

          if (oAjax.readyState == 4) {

             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);

    }

     希望对大家有用

  • 相关阅读:
    java实现第七届蓝桥杯平方圈怪
    Java三大器之过滤器(Filter)的工作原理和代码演示
    spring mvc 防止重复提交表单的两种方法,推荐第二种
    防止订单重复提交
    Swagger入门教程
    BigDecimal的用法详解(保留两位小数,四舍五入,数字格式化,科学计数法转数字,数字里的逗号处理)
    很认真的聊一聊程序员的自我修养
    JAVA利用反射映射JSON对象为JavaBean
    Eclipse导出JavaDoc(并解决中文乱码问题)
    Eclipse注释模板设置详解
  • 原文地址:https://www.cnblogs.com/Z-Xin/p/7079814.html
Copyright © 2011-2022 走看看