在 Web 输入之间更改焦点

Question

在 JavaScript/jQuery 网络上下文中，具有：

两个已启用的表单文本输入字段 A 和 B
如果 none 个输入字段具有焦点，则应禁用输入字段

即通过 jQuery 的 focusout 功能来检查 A 和 B 何时都失去焦点工作正常，但是当 A 失去对 B 的焦点时（tab 或通过选择 B），我无法检查 B 是否获得了焦点，因为在焦点更改完成之前 A 的 focusouts。

如何通过 focusout 或 equal 检查在输入字段之间切换时 A 和 B 都失去了焦点？

示例：

当两者都失去焦点时禁用输入字段，但不幸的是在它们之间切换时也会禁用输入字段 - 这不是本意。

$('input').focusout(function() {
    if ($(':focus').length === 0) { // does not count the other input yet
        $("input").prop('disabled', true);
    }
});

https://jsfiddle.net/hbypowv4/

Answer 1

您可以像这样使用 window.setTimeout() 来完成：

$(document).ready(function() {
  $('input').focusout(function() {
    window.setTimeout(function() {
        if ($(':focus').length === 0) {
            $("input").prop('disabled', true);
        }
    }, 5);
  });    
});

Answer 2

您可以使用 MouseEvent.relatedTarget 来检查 A 是否失去对 B 的关注

The MouseEvent.relatedTarget read-only property is the secondary target for the event, if there is one

https://jsfiddle.net/hbypowv4/2/

在 Web 输入之间更改焦点

Change focus between web inputs

javascript

jquery

focusout

jquery-focusout