由于某种原因，我无法让jQuery序列化我的表单。进行谷歌搜索只是使我想到了一系列类似的问题，而O.P.却忘了给输入一个“名称”。但这不是我的问题，因为我的输入确实有名字...
$('#time_clock_form').serialize();
在此表单上不返回任何内容
<form id="time_clock_form" method="POST">
<label for="id">Enter last four ligits of SSN</label>
<input type="text" id="ssn" name="ssn" maxlength="4">
<input name="submit" value="Punch Timeclock" type="submit">
</form>
我整个早上都在扯头发。我什至还为输入提供了结束标记。 （显然，这没有用）
这是我要序列化数据的地方
// When the user types in their ssn, punch the timeclock
$('#ssn').on('input', function(){
// When the user has input all 4 digits...
if($(this).val().length === 4){
// Disable the input (only until the AJAX request completes...)
$(this).prop('disabled', true);
console.log($('#time_clock_form').serialize());
// Send the AJAX request to punch the time clock
$.ajax({
url : 'AJAX_punchTimeClock.php',
data : $('#time_clock_form').serialize(),
success : function(Result){
// We can't use $(this) here because it would refer to the AJAX request, and not the input. Don't you just LOVE context errors?
$('#ssn').prop('disabled', false);
console.log(Result);
},
error : function(XHR, textError, error){
}
});
}
})
最佳答案
问题是因为在序列化之前禁用input。 serialize()在禁用的表单元素上不起作用。更改这些语句的顺序：
$('#ssn').on('input', function() {
if ($(this).val().length === 4) {
// serialize the form and store the output here
console.log($('#time_clock_form').serialize());
// then disable the form...
$(this).prop('disabled', true);
// ajax...
}
});
Updated fiddle