2013-08-06 2 views
0

iframe (일부 앵커 요소가 있음)과 앵커 태그 (닫기 버튼)가 포함 된 div가 있습니다. 키보드를 사용하여 탐색하는 동안 '닫기'버튼이 마지막 활성 요소 인 경우 div에 초점을 맞춰야합니다.마지막 활성 요소를 기반으로 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(); 

    } 
} 
}); 

기본적으로

+1

샘플 링크 : http://jsfiddle.net/JBJ9P/ – user1153484

+0

는 용서,하지만 어떻게 하나 "는'div'에 초점을 배치"는 무엇입니까? 'div's는 포커스를받을 수 없습니까? – FixMaker

답변

1

div를가 포커스를받을 유일한 요소와 링크를 형성 할 수있는 솔루션을 제공하십시오. 그러나 최근 브라우저에서는 tabindex를 명시 적으로 설정하여 포커스를 지정할 수 있습니다.

확인이 밖으로 http://api.jquery.com/focus/