根據最後一個活動元素聚焦一個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/