当焦点离开一组控件时，jQuery引发事件

Question

我在一个div中有三个文本框，当焦点离开其中一个输入而没有转到这三个输入中的另一个时，我需要引发一个事件。

只要用户正在编辑这3个控件中的一个，事件就不会引发。只有当焦点更改为不是这些输入之一的控件时，事件才会引发。

我尝试在所有3个输入上使用focusout，并检查document.ActiveElement是否是3个输入之一，但一个控件的focusout出现在另一个控件上的focusin之前，因此document.ActiveElement始终为空。

有人知道如何绕过这个吗？

Answer 1

我会考虑使用计时器来解决这个棘手的难题。

失去焦点时，启动计时器。然后，如果焦点设置在另一个"安全"输入上，则可以取消计时器。

类似这样的东西：

var timeoutID;
$("#TheSafeZone input").focus(function () {
    if (timeoutID) {
        clearTimeout(timeoutID);
        timeoutID = null;
    }
});
$("#TheSafeZone input").blur(function () {
    releaseTheHounds();
});
function releaseTheHounds() {
    timeoutID = setTimeout(function () {
            alert("You're all going to die down here");
    }, 1);
}

以下是的工作示例

注意：我已经将超时设置为1ms，这对我来说似乎可靠，但可能值得在其他浏览器中进行一些测试（我使用的是Chrome）。我想这取决于JS引擎如何处理事件，但我对这方面的了解还不够，不能自信地说所有浏览器都将使用相同的

Answer 2

用相反的逻辑放置"模糊"one_answers"聚焦"事件，这样当任何用户离开div中指定的控件组时，只会触发"模糊"事件。

$(document).on("blur","#edit-area .form-control", function (event) {
      $('.editButtons').show();
  });
  $(document).on("focus","#edit-area .form-control", function (event) {
      $('.editButtons').hide();
  });