jQuery中的Ajax

一.load方法

　　只显示北加州文档的一部分,可以在URL后加个空格和一个jquery选择器,当URL加载完成后,jquery会用指定的选择器来从加载好的html中选取要显示的部分

//加载并显示天气预告的温度部分
$("#temp").load("weather_report.html #temperature");

　　除了必须的URL参数.load()方法还接受两个可选参数

//加载特定区号的天气预报
$("#temp").load("weather_report.html"," zipcode=02134");
//使用对象作为数据,并指定为华氏温度
$("#temp").load("weather_report.html",{zipcode:02134,units:'F'});

　　load的另一个参数是回调函数,当ajax请求成功或失败时,会调用改回调函数,如果未指定任何 数据,回调函数可以作为第二个参数传入,否则,它必须是第三个参数

二.jQuery.ajax()

jQuery.ajax({
   type: "get",    
   url: url,
   data: null,
   dataType: "script",
   success: callback    
})

　　1.jQuery.ajax()中的通用选项

 　　type

　　 url

　　 data:添加发送的数据,可以是字符串或对象.通常会把对象抓换成字符串

　　 dataType:指定相应数据的预期类型和jquery处理该数据的方式,合法值是"text,html,scrit,json,jsonp,xml",该选项没有默认值,当没有指定时,jquery会检查相应中的content-type头确定如何处理返回的数据

　　 contentType:指定请求的HTTP Content-Type头,默认是"application/x-www-form-urlencoded",如果type:post则需要设置该值(我怎么没有印象要设呢??~!)

　　 timeout:超时时间,单位是毫秒,若设置该项,请求会取消同时触发error回调,回调中的状态码参数为"timeout",默认时间是0,表示除非亲求完成,否者永远不会取消

　　 cache:对弈get请求,如果设置该项为false,jquery会添加一个"_="参数到url中,或者替换已经该存在的同名参数,该值是当前时间,可以禁用基于浏览器的缓存,因为每次求求的url都不一样

　　 ifModified

　　 global

　　2.回调

　

// 提交表单数据到后台处理
$.ajax({
    type: "post",
    data: studentInfo,
    contentType: "application/json",
    url: "/Home/Submit",
    beforeSend: function () {
        // 禁用按钮防止重复提交
        $("#submit").attr({ disabled: "disabled" });
    },
    success: function (data) {
        if (data == "Success") {
            //清空输入框
            clearBox();
        }
    },
    complete: function () {
        $("#submit").removeAttr("disabled");
    },
    error: function (data) {
        console.info("error: " + data.responseText);
    }
});

　　context:指定回调函数在调用时的上下文对象-this,没有默认值,若不设置,this会指向选项对象

　　beforeSend:指定ajax请求发送到服务器之前激活的回调函数.第一个参数是XMLHttpRequest对象,第二个参数是该请求的选项对象beforeSend回调是的程序有机会在XMLHttpRequest对象上设置自定义HTTP

　　　　　　　　头部.如果该回到函数返回false,ajax请求会取消,注意跨域的script和jsonp请求没有使用XMLHttpRequest对象,因为不会触发beforeSend的回调.

防止重复数据

在实际项目开发中，提交表单时常常由于网络或者其原因，用户点击提交按钮误认为自己没有操作成功，进而会重复提交按钮操作次数，如果页面前端代码没有做一些相应的处理，通常会导致多条同样的数据插入数据库，导致脏数据的增加。要避免这种现象，在$.ajax请求中的beforeSend方法中把提交按钮禁用掉，等到Ajax请求执行完毕，在恢复按钮的可用状态。

举个例子：

// 提交表单数据到后台处理
$.ajax({
    type: "post",
    data: studentInfo,
    contentType: "application/json",
    url: "/Home/Submit",
    beforeSend: function () {
        // 禁用按钮防止重复提交
        $("#submit").attr({ disabled: "disabled" });
    },
    success: function (data) {
        if (data == "Success") {
            //清空输入框
            clearBox();
        }
    },
    complete: function () {
        $("#submit").removeAttr("disabled");
    },
    error: function (data) {
        console.info("error: " + data.responseText);
    }
});

　　success:指定ajax请求完成成功是的回调函数.第一个参数是服务器发送的数据,第二个参数是jquery的状态吗,第三个参数是用来发送该请求的XMLHttpRequest对象.

　　error:请求不成功是调用的回调函数.第一个参数是XMLHttpRequest对象(如果用到的话);第二个参数是jquery的状态码:

　　　　　　http错误:error　　　超时:timeout　　　　解析出错:parsererror

　　　　　　注意:如果dataType 为script的请求在返回无效javascript代码时不会触发错误,调用的是success而不是error.

　　complete:在调用success/error之后调用complete.

三.工具函数

jQuery.contains()函数用于判断指定元素内是否包含另一个元素。

jQuery.contains( container, contained )