JavaScript onsubmit preventDefault 没有条件地工作

Question

如果我在 onsubmit 中使用 e.preventDefault() 它会阻止表单提交。但是，如果我有条件地使用它，它就不起作用。见以下代码：

var register = document.getElementById('registerForm');

register.onsubmit = function(e){
  e.preventDefault(); //it is working
}

register.onsubmit = function(e){
  if(5==5){
    e.preventDefault(); // it is not working
  }
}

<form action="#" id="registerForm">
  <input type="text" id="username">
  <input type="submit" id="submitBtn">
</form>

Answer 1

该代码运行良好。但是，其他一些事件不允许它运行。也可能是一些控制台错误。但是，如果你想打破流程，你也可以这样做：

register.onsubmit = function (e) {
  if (5 == 5) {
    return false;
  }
}

但请记住，上面的代码将在执行后中断附加到特定事件的所有进一步指令。

Answer 2

试试这个。我在 Nette Framework 中使用它并且它有效。但是你必须创建 "fake button" 并隐藏真正的提交按钮。 HTML:

<form method="post" id="registerForm">
    <input type="button" id="fakeSubmitButton" />
    <input type="submit" id="submit" style="visibility:hidden" />
<form>

JS: 变量寄存器 = document.getElementById('registerForm'); var fakeBtn = document.getElementById('fakeSubmitBtn');

fakeBtn.click(function(e) { //user clicks on the fake submit button
    if ( 5==5 ) {
        e.preventDefault();
    } else {
        register.submit(); //call submit on real submit button
    }
});

Answer 3

如果您认为这些行中有什么奇怪的地方，为什么不通过添加断点来调试呢？或者把你怀疑的代码放在 try catch 块中，看看是否调用了 catch。

因为 5==5 将始终为真，并且 if 条件不会产生影响。

JavaScript onsubmit preventDefault 没有条件地工作

JavaScript onsubmit preventDefault not working conditionally

javascript

onsubmit