Question

我有一个使用PHP和javascript进行验证的表格。 PHP方面效果很好。 Javascript可以正确验证，但是单击“提交”按钮时，表单将不会提交。

我已经设置了onsubmit =“ return validate（event）;”内部表单元素。

在validate（event）里面，第一行中有event.preventDefault（）。我检查了表单是否正确验证，并且阻止了表单的提交。

在validate（event）的最后，如果没有错误，我将提交表单。

我尝试过

document.getElementById("checkout").submit();

$('form').submit();

$('#checkout').unbind('submit').submit();

$('form')[0].submit();

$('#checkout').off('submit');

有关代码位的摘要。

<form method="post" action="thanks-order.php" id="checkout" name="checkout" onsubmit="return validate(event);">
...
<input type="hidden" name="flag">
<p><input type="submit" name="pay" value="Pay"></p>
...
</form>
<script>
function validate(event)
{
   //prevent form submission
   event.preventDefault();
   //reset error flag
   document.getElementsByName("flag")[0].value = "";

   //
   //form validation code
   //
   ...
   //if error flag is not set to "error"
   if(getFlag()=="")
   {
      //submit form
      //all of these doesn't work
      // document.getElementById("checkout").submit();
      // $('checkout').submit();
      // $('#checkout').unbind('submit').submit();
      // $('form')[0].submit();
      // $('#checkout').off('submit'); // then submit

   }
}
...
</script>

单击提交按钮时出现错误，错误消息将正确显示。但是，如果没有错误，则表单提交对将记录插入数据库（通过thank-order.php）没有影响。

Answer 1

当您在validate中无条件运行preventDefault时，它始终会阻止表单提交，无论如何触发提交

只需按如下所示简单地运行preventDefault即可：

function validate(event) {
   //reset error flag
   document.getElementsByName("flag")[0].value = "";

   //
   //form validation code
   //
   ...
   //if error flag is not set to "error"
   if(getFlag()=="") {
      //submit form
      //all of these doesn't work
      // document.getElementById("checkout").submit();
      // $('checkout').submit();
      // $('#checkout').unbind('submit').submit();
      // $('form')[0].submit();
      // $('#checkout').off('submit'); // then submit

   } else {
       //prevent form submission
       event.preventDefault();
   } 
}

事件preventDefault后无法提交表单

1 个答案: