$.ajax()方法
$.ajax()方法是jQuery最底层的Ajax实现。
它的结构为:
$ajax(options);
这个对象里包含了$.ajax()方法所需要的请求设置以及会掉函数信息,参数以key/value 的形式存在,所有参数都是可选的,常用参数如表 6-3所示。
参数名称 类型 说明
url string (默认为当前页地址)发送请求的地址
type string 请求方式(post或get)默认为get,注意其他http请求方法,例如put和delete 也可以使用。
timeout Number 设置请求超时时间(毫秒),此数值将覆盖$.ajaxSetup()方法得全局设置。
data object 发送到服务器的数据,如果已经不是字符串,将自动转换为字符串格式,Get请求中将附加在URL后,防止这种自动转换,可以查看processData选项,对象必须为key/value格式
例如{fool:"bar1",foo2:"bar2"} 转换为&fool=bar1&foo2=bar2 如果是数组,jquery 将自动为不同值对应同一个名称 例如 {foo:["bar1","bar2"]} 转换为 &foo=bar1&foo=bar2
dataType string 预期服务器返回的数据类型,如果不指定,jQuery将自动根据HTTP包MIME信息返回responseXML 或responseText,并作为回调函数参数传递。
可用的类型如下。
xml:返回XML文档,可用jQuery处理
html:返回存文本Html信息;包含的script标签会在插入DOM时执行
script:返回纯文本javascript代码,不会自动缓存结果,除非设置了cache参数,注意在远程请求时(不在同一个领域下),所有post请求都将转为get请求
json:返回json 数据
jsonp:JSONP格式,使用SONP形式调用函数时,例如myurl?callback=?,jQuery将自动替换后一个"?"为正确的函数名,以执行回调函数
text:返回存文本字符串
beforeSend function 发送请求钱可以修改xmlhttprequest 对象的函数,例如添加自定义http头,在beforeSend中如果返回false 可以取消本次Ajax请求,xmlHttpRequest对象是惟一的参数
complete function 请求完成后调用的回调函数(请求成功或失败时均调用) 参数XMLHttpRequest对象和一个描述成功请求类型的字符串 function(xmlhttprequest,textstatus){ this;//}
success function 请求成功后调用的回调函数,有两个参数
(1)有服务器返回,并根据dataType参数进行处理后的数据。
(2)描述状态的字符串。
function(data,textStatus){ //data 可能是xmlDoc,jsonObj,html,text等等 this//调用本次ajax时传递的option参数 }
error funciton 请求失败时被调用的函数,该函数有3个参数,即XMLHttpRequest对象,错误信息,捕获的错误对象(可选)
Ajax事件函数如下。
function(XMLHttpRequest,textStatus,errorThrown) { //通常情况下textstatus 和errorThrow 只有其中一个包含信息this//调用本次 ajax请求时传递的options参数 }
global boolean 默认为true 表示是否处罚全局ajax事件,设置为false 将不会触发全局ajax事件,ajaxstart或ajaxStop可用于控制各种Ajax事件
$.load(),$get(),$post(),$getScript()和$.getJSON这些方法,都是基于$.ajax()方法构建的,$ajax()方法是jQuery最底层的Ajax实现,因此可以用来代替前面的所有方法。
使用jQuery 代码代替$.getScript()方法
$(function(){
$('#send').click(function(){
$ajax({
type:"GET",
url:"test.js",
dataType:"script"
});
});
})
使用jQuery 代码来代替$getJSON()方法:
$(funciton(){
$('#send').click(function(){
$.ajax({
type:"GET",
url:"test.json",
dataType:"json",
success:function(data){
$('#resText').empty();
var html='';
$each(data,function(commentIndex,commnet){
html+='<div class="comment"><h6>'
+comment['username']+':</h6><p class="para">'
+comment['content']+'</p></div>';
});
$("#resText") .html(html);
}
});
})
})
序列化元素serialize()方法
表单是必不可少的,经常用来提供数据.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
* { margin:0; padding:0;}
body { font-size:12px;}
.comment { margin-top:10px; padding:10px; border:1px solid #ccc;background:#DDD;}
.comment h6 { font-weight:700; font-size:14px;}
.para { margin-top:5px; text-indent:2em;background:#DDD;}
</style>
<!-- 引入jQuery -->
<script src="../scripts/jquery-1.3.1.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$("#send").click(function(){
$.get("get1.php", $("#form1").serialize() , function (data, textStatus){
$("#resText").html(data); // 把返回的数据添加到页面上
}
);
})
})
</script>
</head>
<body>
<form >http://www.cnblogs.com/qleelulu/archive/2008/04/21/1163021.html