防止onblur代码执行，如果点击提交按钮

Question

通过以下代码，我希望"做点什么"上的"ONBLUR"的元素id="eg1"只有当ONBLUR事件不是由于提交按钮上的"ONCLICK"引起的

    $(document).ready(function() {  
     $('#eg1').blur(function() {
      if(!($("#SubmitBut").click())) {
             //do something
      }
     });
    });

例如:如果用户更改"eg1"文本字段的值并单击下一个文本字段，则DO SOMETHING代码必须运行，但如果用户更改"eg1"字段的值并单击提交按钮，则DO SOMETHING代码必须不运行。

这样做是正确的吗?请指导。

Answer 1

一个元素的blur事件先于另一个元素的click事件触发。所以一种方法是使用mousedown和mouseup事件来切换标志，因为一个元素的mousedown事件在另一个元素的blur事件之前触发。

$("#eg1").on("blur", function(e){
  if($("#submit").data("mouseDown") != true){
      alert("DO SOMETHING");
  }
});
$("#submit").on("mousedown", function(e){
    $("#submit").data("mouseDown", true);
  });
$("#submit").on("mouseup", function(e){
    $("#submit").data("mouseDown", false);
  });

Answer 2

A trick -
 $(document).ready(function() {  
var flag = false;
     $('#eg1').blur(function() {
flag = true;
      if(!($("#SubmitBut").click())) {
if(flag) 
   return false;            
 //do something
      }
     });
    });

Answer 3

更新:

$('input[type="submit"]').mousedown(test);

看一下这个fiddle JSFiddle来解决您的问题。使用控制台查看执行特定操作后触发和抑制的事件。

当执行click或submit时，您应该抑制绑定到文本的事件处理程序

Answer 4

回答这个老问题(因为它是我在Google上第一次出现的)。在另一个sso问题中描述了一个更优雅的解决方案，那就是在onMouseDown处理程序中调用event.preventDefault()。

所以在现代组件框架中:

<button onMouseDown={(e) => e.preventDefault()} /button>