Make focusout event ignore some elements

不问归期 提交于 2019-12-11 10:21:54

问题


In the code below if you click on <input type="text" id="one" /> and a "red block" appears. If you focus out then the "red block" disappears.

How do I make it so that focusout wont fire if "red block" or <input type="text" id="two" /> are the next focused elements?

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>

回答1:


You can put the focus on both #one and #two

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

DEMO

Update

You can't really focus a div unless you give it a custom index like this with tabindex="0"

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

and then in jQuery do this

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

DEMO



来源:https://stackoverflow.com/questions/19242391/make-focusout-event-ignore-some-elements

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!