rush:js;">
$(function(){
$('#send').click(function(){
$.ajax({
type: "GET",url: "test.json",data: {username:$("#username").val(),password:$("#password").val()},// 参数为对象
dataType: "json",success: function(data){
// code...
}
});
});
});
$(function(){
$('#send').click(function(){
var username = $("#username").val();
var password = $("#password").val();
$.ajax({
type: "GET",data: "username"+username+"&password"+password,// 参数为字符串拼接,并用&连接
dataType: "json",success: function(data){
// code...
}
});
});
});
以上是一段常规的ajax请求代码,其中分别列举了data参数的两种传递格式。
为了简便ajax请求时的data参数获取,jquery定义了几个快速的方法。
1.serialize()
用法:var data = $("form").serialize();
这样在ajax提交表单数据时,就不用一一列举出每一个参数。只需将data参数设置为 $("form").serialize() 即可。
其核心方法是$.param(),用来对一个数组或对象按照key/value进行序列化,
var obj = {first:"one",last:"two"}; var str = $.param(obj); console.log(str); // first=one&last=two
另外,使用serialize有个好处是自带中文编译处理。所以,推荐使用serialize。
2.serializeArray()
用法:var jsonData = $("form").serializeArray();
返回值:将页面表单序列化成一个JSON结构(键值对)的对象。
比如,[{"name":"lihui","age":"20"},{...}] 获取数据为 jsonData[index].name
综上:在使用ajax提交表单数据时,data参数设置为$(form).serialize()或$(form).serializeArray()都可以。另外有些细节建议参考w3c。
最后补充一个完整实例。
html:
rush:js;">
<Meta charset="utf-8">
JavaScript:
rush:js;">
rush:js;">
以上所述是小编给大家介绍的jQuery 表单序列化实例代码,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!