提交ajax后清除表单值

我使用以下脚本来validation我的联系表单。

//submission scripts $('.contactForm').submit( function(){ //statements to validate the form var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/; var email = document.getElementById('e-mail'); if (!filter.test(email.value)) { $('.email-missing').show(); } else {$('.email-missing').hide();} if (document.cform.name.value == "") { $('.name-missing').show(); } else {$('.name-missing').hide();} if (document.cform.phone.value == "") { $('.phone-missing').show(); } else if(isNaN(document.cform.phone.value)){ $('.phone-missing').show(); } else {$('.phone-missing').hide();} if (document.cform.message.value == "") { $('.message-missing').show(); } else {$('.message-missing').hide();} if ((document.cform.name.value == "") || (!filter.test(email.value)) || (document.cform.message.value == "") || isNaN(document.cform.phone.value)){ return false; } if ((document.cform.name.value != "") && (filter.test(email.value)) && (document.cform.message.value != "")) { //hide the form //$('.contactForm').hide(); //show the loading bar $('.loader').append($('.bar')); $('.bar').css({display:'block'}); /*document.cform.name.value = ''; document.cform.e-mail.value = ''; document.cform.phone.value = ''; document.cform.message.value = '';*/ //send the ajax request $.post('mail.php',{name:$('#name').val(), email:$('#e-mail').val(), phone:$('#phone').val(), message:$('#message').val()}, //return the data function(data){ //hide the graphic $('.bar').css({display:'none'}); $('.loader').append(data); }); //waits 2000, then closes the form and fades out //setTimeout('$("#backgroundPopup").fadeOut("slow"); $("#contactForm").slideUp("slow")', 2000); //stay on the page return false; } }); 

这是我的表格

 

Please enter your name

Please enter a valid phone number
Please enter message

我需要在成功提交后清除表单字段值。 我怎样才能做到这一点?

 $("#cform")[0].reset(); 

或者在普通的javascript中:

 document.getElementById("cform").reset(); 

您可以在$ .post调用成功回调中执行此操作

 $.post('mail.php',{name:$('#name').val(), email:$('#e-mail').val(), phone:$('#phone').val(), message:$('#message').val()}, //return the data function(data){ //hide the graphic $('.bar').css({display:'none'}); $('.loader').append(data); //clear fields $('input[type="text"],textarea').val(''); }); 
 $('.contactForm').submit(function(){ var that = this; //...more form stuff... $.post('mail.php',{...params...},function(data){ //...more success stuff... that.reset(); }); }); 

用这个:

 $('form.contactForm input[type="text"],texatrea, select').val(''); 

或者如果您this表单有引用:

 $('input[type="text"],texatrea, select', this).val(''); 

:input === + s + s

只是

 $('#cform')[0].reset(); 
 $.post('mail.php',{name:$('#name').val(), email:$('#e-mail').val(), phone:$('#phone').val(), message:$('#message').val()}, //return the data function(data){ if(data==){ $('#
').find(':input').each(function() { switch(this.type) { case 'password': case 'select-multiple': case 'select-one': case 'text': case 'textarea': $(this).val(''); break; case 'checkbox': case 'radio': this.checked = false; } }); } });

http://www.electrictoolbox.com/jquery-clear-form/

它的工作原理:在ajax成功后调用此函数并发送您的表单ID作为参数。 像这样的东西:

此function清除所有输入字段值,包括按钮,提交,重置,隐藏字段

 function resetForm(formid) { $('#' + formid + ' :input').each(function(){ $(this).val('').attr('checked',false).attr('selected',false); }); } 

*此function清除除按钮,提交,重置,隐藏字段外的所有输入字段值* * /

  function resetForm(formid) { $(':input','#'+formid) .not(':button, :submit, :reset, :hidden') .val('') .removeAttr('checked') .removeAttr('selected'); } 

例:

  

提交表单时在表单中设置id

  
set in jquery document.getElementById("cform").reset();