jQuery中使用ajax

基本属性

$.ajax({
            url:'add.php',
            type:'post',
            data:{id:1,name:'ashen'},
            success:function(res){
                console.log(res);
            }
        })

• dataType：设置响应体数据类型

• success函数：只有状态码为200即请求成功才会执行

• error函数：只有请求不正常才执行，即状态码不是200

• complete函数：请求完成后执行，即成功或失败都会执行

• beforeSend函数：在发送请求之前执行

高度封装函数

• $.get(url,数据,成功后执行的函数) 发送get请求

• $.post(url,数据,成功后执行的函数) 发送post请求

• $.getJSON(url,数据,成功后执行的函数) 发送get请求 并设置响应体为json格式

• $.getScript() 发送get请求 并设置响应体为javascript格式

全局事件处理函数

• $(selector).ajaxStart(function(){}); 给某一元素注册请求开始时触发的事件 全局事件处理函数

• $(selector).ajaxStop(function(){}); 给某一元素注册请求结束时触发的事件 全局事件处理函数

　　

其中加入css或其他效果，可以实现正在加载或加载进度条等用户体验性较好的页面

如：

$(document)
   .ajaxStart(function () {
     NProgress.start()
   })
   .ajaxStop(function () {
     NProgress.done()
   })

NProgress 实现进度条

 

$(selector).load()

• 将$(selector)重新加载，通过load中的参数指定被载入的代码

• load(url,数据,请求成功后回调的函数)

• 默认使用 GET 方式 - 传递附加参数时自动转换为 POST 方式。jQuery 1.2 中，可以指定选择符，来筛选载入的 HTML 文档，DOM 中将仅插入筛选出的 HTML 代码。语法形如 "url #some > selector"。