我想使用ajax发布HMTL表单的数据,以便发布与我正常提交的数据相同的数据。
在HTML5之前我会做这样的事情:
$("input[type='radio']:checked, input[type='checkbox']:checked, textarea, input[type='text']")
所以我一直在使用$('form :input')
,因此对于所有不同的类型=电子邮件/搜索/等等,它更具有未来性。
问题是它仍然会发送checkbox / radio的值,即使它尚未被选中。解决这个问题的最佳方法是什么?
CODE:
$('#button').on('click', function(){
$.ajax({
url: 'myurl.com',
type: 'post',
data: $('form :input'),
dataType: 'json',
success: function() {
alert('success');
},
error: function(xhr, ajaxOptions, thrownError) {
alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
}
});
});
答案 0 :(得分:2)
你试过了吗?
$('#button').on('click', function(){
$.ajax({
url: 'myurl.com',
type: 'post',
data: $('form').serialize(),
dataType: 'json',
success: function() {
alert('success');
},
error: function(xhr, ajaxOptions, thrownError) {
alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
}
});
});
答案 1 :(得分:0)
作为Tiago Reis的回答,您可以序列化表格。如果您想要更灵活的方式,那么您可以浏览每个表单元素,如下所示。这是不完整的代码段,所以试着理解。
function getFormData()
{
var retObjectc = {};
$("#myform").find( 'input[type=text],input[type=time], input[type=hidden],input[type=checkbox],input[type=radio], textarea, select' )
.each( function (key,value)
{
if( $(value).prop("tagName") == "INPUT" )
{
if( $(value).prop("type") == "checkbox" )
{
retObjectc[$(value).prop("name")] = $(value).is(":checked");
}
else
{
retObjectc[$(value).prop("name")] = $(value).val();
}
}
else if( $(value).prop("tagName") == "SELECT" )
{
retObjectc[$(value).prop("name")] = $(value).val();
}
});
return JSON.stringify(retObjectc);
}