jQuery中对ajax的封装

一、底层接口

$.ajax({
        url:'xxx', // 请求地址
        type:'get', // 请求方式get/post
        data:{id:1,name:'张三'}, // 请求参数
        dataType:'json', // 用于设置响应体的类型，跟data参数没有关系
        beforeSend:function(){
          // 在所有发送请求操作（open，send）之前执行
        },
        success:function(res){
          // 回调函数，只有请求正常（状态码为200）才会执行这个函数
        },
        error:function(err){
          // 回调函数，只有请求不正常（状态码不为200）才会执行这个函数
        },
        complete:function(content){
          // 回调函数，不管是否请求成功，都会执行
        }
      })

二、全局事件处理

  //1.请求开始之前执行 ajaxStart
  $(document).ajaxStart(function(){
    // 只要有ajax请求发生就会执行
    //请求开始了 -- 可以在这处理loading动画
    $('.loading').fadeIn()
  })

  // 2.请求结束之后执行 ajaxStop
  $(document).ajaxStart(function(){
    // 只要有ajax请求结束就会执行
    //请求结束了 -- 可以在这处理loading动画
    $('.loading').fadeOut()
  }) 

三、get请求

      $.get('url',{id:1},function(res){
        console.log(res)
      })

四、post请求

      $.post('url',{id:1},function(res){
        console.log(res)
      })

五、请求json数据

      $.getJSON('url',{id:1},function(res){
        console.log(res)
      })

前端进阶精选：点此去