我有一个带有许多输入字段的表单。
当我用jQuery捕获提交表单事件时,是否有可能在一个关联数组中获得该表单的所有输入字段?
我有一个带有许多输入字段的表单。
当我用jQuery捕获提交表单事件时,是否有可能在一个关联数组中获得该表单的所有输入字段?
当前回答
当我需要对所有表单字段进行ajax调用时,我遇到了:input选择器返回所有复选框的问题,无论它们是否被选中。我添加了一个新的选择器来获得可提交的表单元素:
$.extend($.expr[':'],{
submitable: function(a){
if($(a).is(':checkbox:not(:checked)'))
{
return false;
}
else if($(a).is(':input'))
{
return true;
}
else
{
return false;
}
}
});
用法:
$('#form_id :submitable');
我还没有测试它与多个选择框虽然,但它的工作,以标准提交的方式得到所有的表单字段。
我在OpenCart网站上定制产品选项时使用了这个选项,包括复选框和文本字段以及标准的选择框类型。
其他回答
这段代码可以工作 而不是名称,电子邮件输入您的表单字段的名称
$(document).ready(function(){
$("#form_id").submit(function(event){
event.preventDefault();
var name = $("input[name='name']",this).val();
var email = $("input[name='email']",this).val();
});
});
联想?不是没有一些工作,但你可以使用通用选择器:
var items = new Array();
$('#form_id:input').each(function (el) {
items[el.name] = el;
});
Serialize()是最好的方法。@ Christopher Parker说,Nickf的回答实现了更多,但它没有考虑到表单可能包含文本区域和选择菜单。最好使用serialize(),然后根据需要对其进行操作。serialize()中的数据可以在Ajax post或get中使用,因此没有任何问题。
$('#myForm').submit(function() {
// get all the inputs into an array.
var $inputs = $('#myForm :input');
// not sure if you wanted this, but I thought I'd add it.
// get an associative array of just the values.
var values = {};
$inputs.each(function() {
values[this.name] = $(this).val();
});
});
感谢来自Simon_Weaver的提示,这里有另一种方法,你可以使用serializeArray:
var values = {};
$.each($('#myForm').serializeArray(), function(i, field) {
values[field.name] = field.value;
});
注意,这个代码段在<select multiple>元素时将失败。
在jQuery 1.3版本中,新的HTML 5表单输入不能使用serializeArray。这适用于版本1.4+
所有答案都很好,但如果函数中有一个字段你想忽略?简单,给字段一个属性,例如ignore_this:
<input type="text" name="some_name" ignore_this>
在你的Serialize函数中:
if(!$(name).prop('ignorar')){
do_your_thing;
}
这是忽略某些字段的方法。