jquery tabindex/focus & 热键
在几个浏览器中 tabindex 似乎存在一些问题,所以我想使用 javascript/jquery 解决这些问题。 具体来说,FF3.5 (Mac) 不接受 tabindex 或根本不关注链接。 我的网站上运行着 jquery 1.3.2 和 js-hotkeys 0.7.9。
我在一页上有 4 个表格,我可以使用链接在它们之间切换。 现在,当页面加载时,我使用其中的 id 获得焦点的链接之一。 然后我希望能够在每个链接之间切换以显示每个表单。
精简代码如下所示:
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
$(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();
});
});
There seem to be some problems with tabindex in several browsers so I want to work around these issues using javascript/jquery. Specifically FF3.5 (Mac) doesn't accept tabindex or focus on links at all. I have jquery 1.3.2 and js-hotkeys 0.7.9 running on my website.
I have 4 forms on 1 page which I can switch between using a link. Now when the page loads I what 1 of the links to have the focus using it's id. Then I want to be able to tab between each link to display each form.
Stripped down code looks like this:
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
$(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();
});
});
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
这不是 Firefox 的问题。 这是 Mac OS 的系统设置。 在系统偏好设置中,键盘和 鼠标和键盘快捷键,有一个完整的键盘访问设置,允许用户配置是否希望 Tab 启用将键盘焦点更改为仅文本框和列表或所有控件。 默认情况下,它仅设置为文本框和列表。
Mac OS 上的 Safari 在 Safari、首选项、高级、按 Tab 突出显示网页上的每个项目中有一个设置,以覆盖此行为。
This isn't a Firefox issue. It's a system setting for 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. 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.
我认为您忘记了“帖子”之后的“表格”:
I think you forgot the "Form" after "post":