Question

我有一个弹出式对话框，可让您在单击按钮时编写文本并执行操作。我的代码在

之下

这个功能有效，我通过查看e.originalEvent.explicitOriginalTarget找到新对象。但是现在我注意到如果我按Tab键这个函数将被调用，但e.originalEvent.explicitOriginalTarget将给我相同的当前对象而不是新对象。因此，如果用户按Tab键离开，我的对话框就不会关闭。我如何找到正确的新dom项？

$('#Area').focusout(function (e) {
    if ($(e.originalEvent.explicitOriginalTarget).closest('#Area').size() == 0)
        $('#Area').hide();
});

Answer 1

event.relatedTarget为我工作。如果有的话，它会在事件中给出其他DOM元素。

一个例子是，如果您有2个按钮控制相同的功能，并且如果连续点击它们，则不希望执行它们的代码。您可以附加一个focusout事件处理程序并检查ID或类名。

$(".buttons").on("focusout", function (event) {
    if($(event.relatedTarget).prop("class").indexOf("buttons") === -1) {
        //code to execute
    }
});

也许更好的例子就是我遇到的问题。

我创建了一个自定义下拉列表，旁边有一个按钮。可以通过单击列表或按钮来打开和关闭下拉列表。它也可以被关闭，失去对任何一个对象的焦点。

这在以下情况中成为问题。 1）用户通过单击列表对象打开下拉列表。 2）用户通过单击按钮关闭下拉列表。

列表打开后会发生什么，但是当用户关闭列表时，列表会失去焦点，关闭它，但由于他们点击按钮，它会打开。在这种情况下，焦点会导致两个对象相互抵消。

通过编写焦点输出事件，我现在可以将其设置为仅在relatedTarget与调用事件的目标没有相同的类时触发。

$(".listControl").on("focusout", function (event) {
    if($(event.relatedTarget).prop("class").indexOf("listControl") === -1) {
        //Close the drop down list
    }
});

http://api.jquery.com/event.relatedTarget/

Answer 2

查看此问题/答案How to select an element that has focus on it with jQuery

我认为你没有得到任何东西的原因是$（“*：focus”）;在Firebug控制台中，当您单击控制台时，该元素将失去焦点。

如果你想用事件解决它，focus()的反面是blur()。

修改的

也许你甚至可以尝试不同的方法。如果您唯一需要注意的是Tab键，则可以使用.keypress()事件并注意标签keycode，即9。

如何使用jquery找到新的焦点项？

2 个答案: