我有一个带有许多输入字段的表单。
当我用jQuery捕获提交表单事件时,是否有可能在一个关联数组中获得该表单的所有输入字段?
我有一个带有许多输入字段的表单。
当我用jQuery捕获提交表单事件时,是否有可能在一个关联数组中获得该表单的所有输入字段?
当前回答
jQuery的serializeArray不包括禁用字段,所以如果你也需要这些,试试:
var data = {};
$('form.my-form').find('input, textarea, select').each(function(i, field) {
data[field.name] = field.value;
});
其他回答
对于多个选择元素(<select multiple="multiple">),我修改了@Jason Norwood-Young的解决方案以使其工作。
答案(如上所述)只接受所选择的第一个元素的值,而不是所有元素。它也没有初始化或返回数据,前者会抛出一个JavaScript错误。
以下是新版本:
function _get_values(form) {
let data = {};
$(form).find('input, textarea, select').each(function(x, field) {
if (field.name) {
if (field.name.indexOf('[]') > 0) {
if (!$.isArray(data[field.name])) {
data[field.name] = new Array();
}
for (let i = 0; i < field.selectedOptions.length; i++) {
data[field.name].push(field.selectedOptions[i].value);
}
} else {
data[field.name] = field.value;
}
}
});
return data
}
用法:
_get_values($('#form'))
注意:你只需要确保你选择的名称有[]附加到它的末尾,例如:
<select name="favorite_colors[]" multiple="multiple">
<option value="red">Red</option>
<option value="green">Green</option>
<option value="blue">Blue</option>
</select>
有时我发现一次一个更有用。为此,有这个:
var input_name = "firstname";
var input = $("#form_id :input[name='"+input_name+"']");
当我需要对所有表单字段进行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网站上定制产品选项时使用了这个选项,包括复选框和文本字段以及标准的选择框类型。
jquery。表单插件可能会帮助其他人在这个问题上寻找什么。我不确定它是否能直接满足你的要求。
还有serializeArray函数。
我使用这段代码没有每个循环:
$('.subscribe-form').submit(function(e){
var arr=$(this).serializeArray();
var values={};
for(i in arr){values[arr[i]['name']]=arr[i]['value']}
console.log(values);
return false;
});