我有一个包含许多输入字段的表单。
当我使用 jQuery 捕获提交表单事件时，是否可以在关联数组中获取该表单的所有输入字段？
使用 jQuery 获取表单输入字段？
IT技术
javascript
jquery
2021-02-01 20:46:38
6个回答
$('#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>元素上失败。
新的 HTML 5 表单输入似乎不适serializeArray用于 jQuery 1.3 版。这适用于 1.4+ 版本
在这个问题上迟到了，但这更容易：
$('#myForm').submit(function() {
// Get all the forms elements and their values in one step
var values = $(this).serialize();
});
该jquery.form插件可以帮助别人正在寻找结束了在这个问题上。我不确定它是否直接执行您想要的操作。
还有serializeArray函数。
有时我发现一次得到一个更有用。为此，有这个：
var input_name = "firstname";
var input = $("#form_id :input[name='"+input_name+"']");
这是另一种解决方案，通过这种方式，您可以获取有关表单的所有数据并在服务器端调用或其他事情中使用它。
$('.form').on('submit', function( e )){
var form = $( this ), // this will resolve to the form submitted
action = form.attr( 'action' ),
type = form.attr( 'method' ),
data = {};
// Make sure you use the 'name' field on the inputs you want to grab.
form.find( '[name]' ).each( function( i , v ){
var input = $( this ), // resolves to current input element.
name = input.attr( 'name' ),
value = input.val();
data[name] = value;
});
// Code which makes use of 'data'.
e.preventDefault();
}
然后，您可以将其与 ajax 调用一起使用：
function sendRequest(action, type, data) {
$.ajax({
url: action,
type: type,
data: data
})
.done(function( returnedHtml ) {
$( "#responseDiv" ).append( returnedHtml );
})
.fail(function() {
$( "#responseDiv" ).append( "This failed" );
});
}
希望这对你们中的任何人都有用:)