根据最后一个活动元素聚焦一个div

Question

我有一个div，其中包含一个iframe（它又有一些锚点元素）和一个锚点标记（关闭按钮）。在使用键盘进行导航时，如果“关闭”按钮是最后一个活动元素，则应该关注div。

但对我来说，重点总是转到div内的iframe。我想把重点放在div上。

<a href="javascript:" class="clicker">click to open</a> 

<div id="wOverlay" style="height: 307px; width: 645px; display: none;"> 
<span style="position:absolute;left:-1500px;top:0;width:1;height:1;overflow:hidden;">Beginning of dialog content</span> 
<iframe scrolling="no" frameborder="0" src="https://www.google.com" title="Quick Look - Opens a simulated dialog"> 
</iframe> 
<a id="overlayClose" class="MultiBoxClose" href="javascript:void(0)">Close</a> 

脚本：

$('.clicker').bind('click',function(){ 


    $('#wOverlay').attr('tabIndex',-1); 
    $('#wOverlay').show().focus(); 

}); 

$(document).bind('keydown', function(e){ 
e = e || window.event; 

if(e.keyCode == 9) { 
    if($(document.activeElement).hasClass('MultiBoxClose')){ 

        $('#wOverlay').focus(); 

    } 
} 
}); 

请提供任何解决方案

Answer 1

的div默认情况下无法获得焦点，只有形成要素和环节。但是，在最近的浏览器中，您可以通过明确设置其tabindex来指定焦点。

检查了这一点http://api.jquery.com/focus/