6

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

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

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

任何人都知道如何解决这个问题？

4

2 回答 2

10

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

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

像这样的东西：

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);
}

这是一个工作示例

注意：我已将超时设置为 just 1ms，这对我来说似乎可靠，但可能值得在其他浏览器中进行一些测试（我正在使用 Chrome）。我想这取决于 JS 引擎如何处理事件，但我对此知之甚少，无法自信地说所有浏览器都可以正常工作

于 2013-07-05T13:08:15.973 回答
0

使用相反的逻辑放置“模糊”和“焦点”事件，这样当用户离开 DIV 中指定的控件组时，只会触发“模糊”事件。

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

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

  });
于 2016-01-05T15:31:26.177 回答