标签索引与引导弹出模态菜单 [英] Tab index with bootstrap pop up modal menu

问题描述

我有一个html页面如何指定tab索引引导弹出模态和主要不同。

如果弹出窗口是打开的表索引应该只适用于弹出模态。
但是当我点击弹出的模态标签转移控制的最后一个元素到主页。

 < a href = ＃>第一个元素< / a> 
。 
。 
 ... 
< a href =＃>弹出式窗口中的最后一个元素< / a> 
 

当我最后按tab键时，应该将焦点转移到第一个元素

$

$

$

$

$ b
$ b

 < a href =＃id =first>第一个元素< / a> 
。 
。 
 ... 
< a href =＃id =last>弹出式窗口中的最后一个元素< / a> 
 

检查最后一个引发的事件是否是制表符，然后将焦点设置为第一个元素

 < script type =text / javascript> 
 document.getElementById（'last'）。onkeydown = function（e）{
 if（e.keyCode == 9）{
 document.getElementById（'first'）。focus ; 
 
} 
} 
   




I have an html page how can i specify tab index for bootstrap popup modal and main differently .

If popup is open table index should be available for popup modal only. But when i click on last element of popup modal tab transfer control to main page.

 <a href="#">first element</a>
 .
 .
 ...
<a href="#" >last element in popup</a>

when i press tab on last a it should transfer focus to first element instead of transferring to main page content

解决方案

add id to select in dom

 <a href="#" id="first">first element</a>
 .
 .
 ...
<a href="#" id="last" >last element in popup</a>

Check if event raised by last a is tab then set focus to first element

  <script type="text/javascript">
            document.getElementById('last').onkeydown = function(e){
                if (e.keyCode == 9) {
                    document.getElementById('first').focus();

                }
            }
     </script>

这篇关于标签索引与引导弹出模态菜单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！