jquery - 将 ajax 与现有表单结合使用

Question

我想用ajax处理这个表单，但是我并不完全清楚在发送之前应该如何处理数据。这是我的表单，它是一个输出该表单的表达式引擎模块，所以我不知道 php 函数会发生什么:

<form id="bookmark_form_entry_106" class="bookmark_form" name="bookmark_form" method="post" action="http://mysite.com//S=1b73e2e22729ccf0613b758ecc7e2631fab28745/">

<div class="hiddenFields">
<input type="hidden" name="XID" value="438068dba50235d9992e1492a6171e892f7bac60">
<input type="hidden" name="ACT" value="50">
<input type="hidden" name="RET"     value="http://mysite.com/S=1b73e2e22729ccf0613b758ecc7e2631fab28745/video/esegui_slq_1">
<input type="hidden" name="type" value="entry">
<input type="hidden" name="data_id" value="106">
<input type="hidden" name="site_id" value="3">
</div>


<input type="submit" value="add bookmark">

</form> 

我将使用 jQuery $.ajax();但我不知道如何处理表单数据:

$.ajax({  
type: "POST",  
url: "http://mysite.com//S=1b73e2e22729ccf0613b758ecc7e2631fab28745/",  // is this correct?
data: ,  // what data should go there?
success: function() {  
 // wohoo, this works! 
}  
});  

我是表单的新手，所以我不确定是否必须了解更多有关 POST 脚本如何处理我的数据的信息，或者知道表单本身的内容就足够了。

我也很好奇如何使用网络检查器(或 Firebug )来测试它，谢谢!

Answer 1

要获取数据，您需要 jQuery 的序列化函数 ( http://api.jquery.com/serialize/ )。

var data = $('#form_id').serialize()

然后只需在 AJAX 调用中使用 data 变量即可!

根据您处理表单提交的具体方式，您应该能够将 $(this) 变量作为已提交的表单。

因此构建调用的一个好方法是:

$.ajax({  
type: "POST",  
url: $(this).attr('action'),  // read the action attribute of the form
data: $(this).serialize(),  // what data should go there?
success: function() {  
 // wohoo, this works! 
}  
});