锋利的jQuery读书笔记(六)

第六章 jQuery与ajax的应用
1 load()方法
1）载入HTML方法
load(url [,data] [,callback]);
$(function(
$("#send").click(function(){
$(“resText”).load(“test.html”);
});
));
只加载test.html中class为para的内容
$(“resText”).load(“test.html .para”);

传递方式

3）回调参数
$("#resText").load(“test.html”,function(responseText,textStatus,XMLHttpRequest){
//responseText;请求返回的内容
//textStatus 请求的状态：success,error,notmodified,timeout
//XMLHttpRequest 对象
});

2 $.get()方法与$ .post()方法
1）$.get(url [,data] [,callback] [,type])
锋利的jQuery读书笔记(六)
例子：
KaTeX parse error: Expected '}', got 'EOF' at end of input: …hp", {username:("#username").val(),
password:$(“password”).val()},
function(data,textStatus){
alert(111);
},
“json”);
2）post方法与get方法类似

3 $.getScript()方法与$ .getjson()方法
1）$.getScript(‘test.js’,function(){
alert();
});
2) $.getScript(‘test.json’,function(data){
//data 返回的数据
$.each(data,function(commentIndex,comment){

});
});

4 $.ajax()方法
$.ajax(options)
锋利的jQuery读书笔记(六)

$.getScript()等价写法
$(function(){
$(’#send’).click(function(){
$.ajax({
type:“GET”,
url:“test.js”.
dataType:“script”
});
});
});
$.getJson()等价写法
$(function(){
$.ajax(function(){
type:“GET”,
url:“test.json”,
dataType:“json”,
success:function(data){
$(‘resText’).empty();
}
});
});

5 序列化元素
1）serialize();
2）serializeArray()方法，将dom元素序列化后，返回json格式的数据
$(":checkbox,:radio").serializeArray(); 3）$ .param();
var obj = {a:1,b:2,c:3};
var k = $.param(obj);
alert(k);//输出a=1&b=2&c=3

6 ajax全局事件

加载中...

$("#loading").ajaxStart(function(){ $(this).show(); }); $("#loading").ajaxStop(function(){ $(this).hide(); });//也可以使用链式写法另外几个方法 ajaxComplete(callback)//Ajax请求完成执行的函数 ajaxError(callback)//Ajax请求发生错误时执行的函数，捕捉到的错误可以作为最后一个参数传递 ajaxSend(callback)//Ajax请求发送前执行的函数 ajaxSuccess(callback)//Ajax请求执行成功时执行的函数

附录：
1 解析xml
success:function(xml){
$(xml).find(“student”).each(
var id = $(this).children("id"); var id_value=id.text(); alert(id_value); alert($ (this).attr(“email”));
);
}

2 禁用缓存（项目中问题：数据已经更新，但传递的还是旧数据，解决方案：禁用缓存）
post方法默认禁用缓存
get方法
$.get(‘ajax.xml?’+(+new Date),function(xml){…})//(+new Date)等价于new Date.get();

锋利的jQuery读书笔记(六)

相关推荐