Javascript 如何在表单提交之前触发onBlur

我有一些

input

框，其中调用了

onBlur

函数进行验证

我面临的问题是，当我直接单击submit按钮而不从

输入

框中弹出时，表单在

onBlur

函数调用之前被提交，并且验证没有发生

---

有人能提出一个解决办法吗。我在JSP页面中使用javascript和JQuery。

可能有更简单的选项，但您可以停止submit按钮，然后在下一帧提交表单（使用setTimeout）：

e、 差不多

$('input[type=submit]').click(function(e){
    var $form = $(this).closest('form');
    e.preventDefault():
    setTimeout(function(){ 
       $form.submit();
    }, 0);
});

然后，问题是如果您在按下

Enter

时要验证的字段上，如何允许

Enter

键表单提交工作。您可能还应该在

submit

上验证整个表单

我想出了以下方法，使用submit事件（因此处理

Enter

）并在

表单上切换一个类（以避免递归），这应该是您想要的：

$('form').submit(function (e) {
    var $form = $(this);
    $form.toggleClass('ignore');
    if ($form.hasClass('ignore')) {
        e.preventDefault();
        $form.find('input[type=text]').blur();
        setTimeout(function () {
            $form.submit();
        }, 0);
    }
});

JSFiddle:

您可以通过在提交处理程序中仅模糊当前聚焦的输入来提高新版本的效率，但它现在允许
Enter
可能是您可以在输入处于聚焦状态时禁用提交按钮，并在输入处于模糊状态时启用它，类似这样：

$('input').focus(function(){
  $('submit').attr("disabled", true);
}).blur(function(){
  $('submit').attr("disabled", false);
});

希望这能帮助你：）
请看这个例子


$（'#blurtest'）.blur（函数（）{
$（'#bluedtext'）.html（$（this.val（））；
});
$（'#testform'）。提交（函数（e）{
$（'blurtest'）。触发器（'blur'）；
$（this.submit（）；
});

模糊文本：
输入文本：
在提交时也进行验证有很多文本框，因此我更喜欢onBlur调用，而不是再次验证这些文本框。只需模糊提交处理程序中当前的重点输入，即可提高新版本（见下文）的效率，但是现在它适用于
Enter
。问：是否仍然会阻止Enter键提交表单？这很有效，非常感谢，只需要找到一种绕过Enter键的方法。这个线程很旧，但这是我为捕获Enter键所做的。对于每个输入，为keyDown添加一个事件侦听器，如果该键为Enter，则执行验证。对我来说，输入是一个react组件，所以基本上我只是向组件添加一个keyDown事件监听器，并向父组件发出“信号”，以防止在出现任何错误时提交表单。