Question

我在母版页上使用了锚标记。在TAB键按下期间，当焦点发生在特定锚标签上，然后再打开时按ENTER键，它会重定向到特定的链接页面。锚标签工作正常。但我想要的是那个当它打开特定的链接页面并重新加载页面时，焦点应保留在该特定链接上。所以在下一个TAB键按下导航/焦点移动到下一个锚标签。但是当前发生的是当我们按下ENTER键时，该锚标签链接打开并在TAB上按键默认导航从URL开始。

<div title="Main" >
            <a href="/Home.aspx" id="home">

                <div class="link-title">
                    Home
                </div>
            </a>
        </div>
        <div title="Contact" >
            <a href="/Contact.aspx" id="contact>

                <div class="link-title">
                    Contact
                </div>
            </a>
        </div>

CSS Code如下所述：

/* To set keyboard focus on Tab press*/
a:focus
{
    outline: 1px dotted black;
}

Answer 1

我认为你期待这个解决方案。

单独使用keydown密钥使用tab事件尝试这种方式。

＆＃13;

$(function () {
            $("a").keydown(function (e) {
                if (e.which == 9) {
                    var ele = $("a");
                    var len = ele.length;
                    var index = ele.index(this);
                    if (index == (len - 1)) {
                        ele.eq(0).focus();
                        e.preventDefault(); //To prevent event bubbling
                    }
                }
            });
        });

＆＃13;

a:focus {
            color: yellow;
            outline: 1px dotted black;
        }

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<div title="Main">
        <a href="/Home.aspx" id="home" target="_blank">
            <div class="link-title">
                Home
            </div>
        </a>
    </div>
    <div title="Contact">
        <a href="/Contact.aspx" id="contact" target="_blank">
            <div class="link-title">
                Contact
            </div>
        </a>
    </div>   
    <div title="About">
        <a href="/About.aspx" id="about" target="_blank">
            <div class="link-title">
                About
            </div>
        </a>
    </div>

＆＃13;

希望这会对你有所帮助。

要重点关注锚标记

1 个答案: