javascript - 让 focusout 事件忽略一些元素

Question

在下面的代码中，如果您单击 <input type="text" id="one" />和一个“红色方 block ”出现。如果你把注意力集中在外面，那么“红色方 block ”就会消失。

我该如何做到 focusout如果“红色方 block ”或 <input type="text" id="two" /> 则不会触发下一个重点元素是什么？

Demo

JavaScript

$('#one').focus(function () {
    $('#divRemove').show();
});

$('#one').focusout(function () {
    $('#divRemove').hide();
});

$('#divRemove').click(function(){
    alert($(this).text());    
});

HTML

<input type="text" id="one" />_______
<input type="text" id="two" />
<br/>
<br/>
<div id="divRemove" style="width:100px;height:100px;background:red; display:none;">remove on focus out</div>

Answer 1

你可以同时关注#one和#two

$('#one,#two').focus(function () {
    $('#divRemove').show();
}).focusout(function () {
    $('#divRemove').hide();
});

DEMO

更新

除非使用 tabindex="0"

为其提供自定义索引，否则您无法真正聚焦 div

<div id="divRemove" tabindex="0"

然后在 jQuery 中执行此操作

$('#one,#two,#divRemove').focus(function () {
    $('#divRemove').show();
}).focusout(function () {
    $('#divRemove').hide();
});

DEMO