简体   繁体   English

jquery tabindex /焦点和热键

[英]jquery tabindex/focus & hotkeys

There seem to be some problems with tabindex in several browsers so I want to work around these issues using javascript/jquery. 在几个浏览器中似乎存在tabindex的一些问题,所以我想使用javascript / jquery解决这些问题。 Specifically FF3.5 (Mac) doesn't accept tabindex or focus on links at all. 特别是FF3.5(Mac)不接受tabindex或根本不关注链接。 I have jquery 1.3.2 and js-hotkeys 0.7.9 running on my website. 我在我的网站上运行了jquery 1.3.2和js-hotkeys 0.7.9。

I have 4 forms on 1 page which I can switch between using a link. 我在1页上有4个表单,我可以使用链接切换。 Now when the page loads I what 1 of the links to have the focus using it's id. 现在,当页面加载时,我使用它的id获得焦点的1个链接。 Then I want to be able to tab between each link to display each form. 然后我希望能够在每个链接之间切换以显示每个表单。

Stripped down code looks like this: 剥离代码如下所示:

HTML HTML

<nav id="postNav">
    <ul>    
        <li class="Nav1"><a href="#">1</a></li>
        <li class="Nav2"><a href="#">2</a></li>
        <li class="Nav3"><a href="#">3</a></li>
        <li class="Nav4"><a href="#">4</a></li>
    </ul>
</nav>

<form class="postForm" id="post1">
</form>

<form class="postForm" id="post2">
</form>

<form class="postForm" id="post3">
</form>

<form class="postForm" id="post4">
</form>

Jquery jQuery的

$(document).ready(function(){               

    $("#postNav ul li a").click(function(event){
        var postOptionSelected = $(this).parent("li").attr("class").substr(3);
        $("form#post"+postOptionSelected).show();
            $("form.postForm:not(#post"+postOptionSelected+")").hide();
            event.preventDefault();
    });
});

This isn't a Firefox issue. 这不是Firefox问题。 It's a system setting for Mac OS. 这是Mac OS的系统设置。 In System Preferences, Keyboard & Mouse, and Keyboard Shortcuts, there's a Full keyboard access setting that allows users to configure whether they want Tab to enable changing keyboard focus to text boxes and lists only or to all controls. 在“系统偏好设置”,“键盘和鼠标”和“键盘快捷键”中,有一个全键盘访问设置,允许用户配置是否希望使用Tab键将键盘焦点更改为仅文本框和列表或所有控件。 It is set to text boxes and lists only by default. 默认情况下,它仅设置为文本框和列表。

Safari on Mac OS has a setting in Safari, Preferences, Advanced, Press Tab to highlight each item on a webpage to override this behavior. Mac OS上的Safari在Safari,首选项,高级,按Tab中有一个设置,以突出显示网页上的每个项目以覆盖此行为。

I think you forgot the "Form" after "post": 我想你忘记了“帖子”之后的“表格”:

    $("form#postForm"+postOptionSelected).show();
    $("form.postForm:not(#postForm"+postOptionSelected+")").hide();

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM