jQuery表单提交

Posted liyuspace

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jQuery表单提交相关的知识,希望对你有一定的参考价值。

【转自】jQuery最简单的表单提交方式

第一步:绑定事件

常用的与ajax相关的事件参考如下:

1、$(selector).click(function)

2、$(selector).change(function)

3、$(selector).keyup(function)

4、$(selector).submit(function)

 

提交表单前,阻止提交按钮的默认的action,或返回false,如:

1、阻止提交按钮的默认的action

$("form").submit(function(e){
    e.preventDefault();  
});

2、返回false

$("form").submit(function() {
    return false;
});

 

第二步:将表单或对象序列化成字符串,也可以将表单序列化成数组形式;

1、将表单内容序列化为字符串
var data = $("form").serialize();  

n1=1&n2=2&n3=3&n4=4

如果为post提交,则:$.post("", data, function (rs) {}, "json");

n1 1
n2 2
n3 3
n4 4

 

2、序列化一个 key/value 对象:
var str = jQuery.param({});

3、将表单序列化成数组形式
var sa = $("form").serializeArray();

 [
{

"name": "n1",
"value": "1"
},
{
"name": "n2",
"value": "2"
},
{
"name": "n3",
"value": "3"
},
{
"name": "n4",
"value": "4"
}
]

第三步:表单提交

表单提交可以参数以下方式:

1、jQuery.ajax([settings])

2、jQuery.get(url,data,success(response,status,xhr),dataType)

3、jQuery.post(url,data,success(response,status,xhr),dataType)

4、jQuery.getJSON(url,data,success(data,status,xhr))

5、$(selector).load(url,data,function(response,status,xhr))

6、jQuery.getScript(url,success(response,status))

详细的jQuery.ajax,点击进入

 







































以上是关于jQuery表单提交的主要内容,如果未能解决你的问题,请参考以下文章

jquerymobile怎么提交表单没有反应

jquery中表单提交,怎么打开新页面?

jquery允许取消提交后提交表单

JQuery函数提交()不提交表单

jquery如何实现form提交无刷新返回一个页面

使用JQuery的.ajax()提交表单后当前页面表单内容被清空,请问如何保留数据?