停止页面在验证失败时重新加载

Question

我目前正在进行 javascript 验证，因此如果没有至少一个复选框被 select 编辑，该表单将不会被提交。它将向用户抛出一条消息，以确保 select 至少有一个用户。

我现在想做的是阻止表单做任何其他事情，它似乎在我点击提交按钮后重新加载页面，如果它不这样做会更好。

我现在的代码如下：

表格：

 <form name="frm_multi_message_form" id="multi_message_form" style="margin-bottom: 0px;"  method="post"><button style="border-style: none; margin: 5px 0 5px 0;" type="submit" action="" onClick="checkForm(this);"  >Message multiple sitters</button>
    </form>

我的Javascript:

  function checkForm(form)
      {

    if (document.querySelector('form[id="multi_message_form"] input[name="username[]"]:checked')) {
            document.frm_multi_message_form.action = "http://example.com/another-page/";
            document.frm_multi_message_form.submit();
        } else {
            alert("You must select at least one sitter to message");

        }
    return false;
      }

我没有发出警报的问题，并且表单已提交，我想知道如何触发 preventDefault（或者这在 javascript 查询中是不允许的吗？？）如果我可以，所以除了显示错误之外什么也没发生。

Answer 1

您应该使用 onClick="return checkForm(this);"，如果验证错误，您的表单将不会被提交

Answer 2

您需要在表单提交上使用事件处理程序来防止默认行为（提交）：

document.getElementById('multi_message_form').addEventListener('submit', function(evt) {
    evt.preventDefault();
})

Answer 3

验证后使用"return false"，如

$("#formId").submit(function()
{
  if(someField == "")
   {
     $("#divId").text();
      return false;
   }
}

停止页面在验证失败时重新加载

Stop page from reloading on failed validation

javascript

wordpress

jquery

form-submit