JQuery的Ajax学习(2)

上一次主要学习了JQuery的Ajax的几个上层方法(http://redstarofsleep.iteye.com/blog/854322 ),这次主要来学习一下$.ajax()这个底层方法.

这次主要学习下这个方法的参数:

1. url  String类型  接受请求的地址

2. type  String类型  GET或者POST,默认是GET

3. timeout  Number类型  超时时间(毫秒)

4. async  Boolean类型  同步或者是异步请求(默认是true,异步)

5. cache  Boolean类型  是否从浏览器缓存中加载请求(默认为true,但是Javascript时为false)

6. data  Object或String类型  发送到服务器的参数(这个同其它几个Ajax方法)

7. dataType  String类型  服务器返回的数据类型(XML,HTML,script,json,jsonp,jQuery,text)

8. beforeSend  Function类型  发送请求前用来修改XMLHttpRequest对象

9. complete  Function类型  请求完成后的回调函数(无论成功或失败都会调用)

10. success  Function类型  请求成功时才会调用的回调函数

11. error  Function类型  请求失败时才会调用的回调函数

12. contentType  String类型  内容的编码类型

13. dataFilter  Function类型  预处理原始返回数据

14. global  Boolean类型  是否出发全局Ajax时间(默认true)

15. ifModified  Boolean类型  是否是仅在服务器数据改变的时候才获取数据(默认值false)

16. jsonp  String类型  重写回调函数的名字(用于jsonp请求)

17. username  String类型  需要HTTP认证时的用户名

18. password  String类型  需要HTTP认证时的密码

19. processData  Boolean类型  发送的数据是否被转换为对象(默认true)

20. scriptCharset  String类型  强制修改字符集

 

 

简单介绍了这整整20个参数,够多的......(个人认为真的不是很常用)

 

在JQuery的Ajax中还有一些方法我觉得到是很实用的

第一个,serialize()

在发送Ajax请求时,最麻烦的就要数从页面获取数据了,尽管通过JQuery的强大的选择器来取相比document.getElementById()一个个来取已经方便了不少,但是当参数很多时代码还是很累赘.Jquery已经为我们提供了一个简便的方法了,那就是serialize(),这个方法可以把某个元素下的内容直接封装成参数的形式.比如我们页面上有个Form

<form id="form1" action="XXX">
    <input type="text" id="userName" name="userName" value=""></intpu>
    <input type="text" id="password" name="password" value=""></input>
    <!--
        还有很多其他元素
        ......
    -->
</form>

 这时候,直接调用serialize()方法就可以获得所有的内容了

$('#form1').serialize();

 所以,我们的Ajax调用会变成这样:

$.post('url', $('#form1').serialize(), callback);

 这样后台就可以拿到所有的数据了,真的是非常的方便.当然serialize()方法不是只能用于form的,任何一个元素都可以.

 

第二个,serializeArray()方法

这个方法与serialize()方法查不多,只不过它返回的是JSON格式的数据而已.

 

第三个,$.param()方法

这个方法是将一个对象或数组转换成key/value的字符串的

var object = {first:1,second:2,third:3};
alert($.param(object));

 上面这段代码打出的是"first=1&second=2&third=3".

 

第四个,ajaxStart()方法

这个方法是Ajax全局方法,即只要页面上发生Ajax请求,这个方法就会被调用

比如页面上有个DIV

<div id="load" style="display:none">请稍后......</div>

 当页面发送Ajax请求时这个DIV就要显示出来

$('load').ajaxStart(
    function() {
        $(this).show();
    }
)

 

第五个,ajaxStop()方法

有ajaxStart(),那必然得有这个ajaxStop(),不解释了,用法和ajaxStart()一样.

 

第六个,ajaxComplete()

请求完成时的全局方法,用法同上.

 

第七个,ajaxError()方法

顾名思义,发生错误时的全局方法,用法同上

 

第八个,ajaxSend()方法

请求发送时执行的方法,用法同上.

 

第九个,ajaxSuccess()方法

请求成功时执行的方法,用法也同上.

 

 

恩,差不多了,JQuery的Ajax查不多也就这些内容,当然我这个介绍的还是比较肤浅的,以后有机会在深入....