我有一个包含许多输入字段的表单.
当我使用jQuery捕获提交表单事件时,是否可以在关联数组中获取该表单的所有输入字段？
$('#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;
});
请注意,此代码段将在元素上失败.
似乎新的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+"']");
$('#myForm').bind('submit', function () {
var elements = this.elements;
});
elements变量将包含表单中的所有输入,选择,textareas和fieldsets.
这是另一种解决方案,通过这种方式,您可以获取有关表单的所有数据,并在服务器端调用或其他内容中使用它.
$('.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" );
});
}
希望这对你们任何人都有用:)
有一个类似的问题,有轻微的扭曲,我以为我会抛出这个.我有一个回调函数,它获取表单,所以我已经有一个表单对象,并且不能轻松变种$('form:input').相反,我提出了:
var dataValues = {};
form.find('input').each(
function(unusedIndex, child) {
dataValues[child.name] = child.value;
});
它的相似但不完全相同的情况,但我发现这个线程非常有用,并且认为我最终会把它塞进去并希望其他人发现它很有用.
京公网安备 11010802040832号 | 京ICP备19059560号-6 