我的 html 包含元素列表。我想使用箭头键来选择元素。
这是我的代码:[http://jsfiddle.net/T8S7c/]
我想要的是预置焦点需要在所选元素中的键,例如悬停效果。(例如,如果我第一次按下向下键,Ambaji 必须处于焦点)
我知道按键事件的代码,但我不知道如何将焦点放在按键上。
任何人都可以帮助我吗
我的 html 包含元素列表。我想使用箭头键来选择元素。
这是我的代码:[http://jsfiddle.net/T8S7c/]
我想要的是预置焦点需要在所选元素中的键,例如悬停效果。(例如,如果我第一次按下向下键,Ambaji 必须处于焦点)
我知道按键事件的代码,但我不知道如何将焦点放在按键上。
任何人都可以帮助我吗
我解决这个问题的策略是通过链接数组指定焦点顺序,以及使用一些变量指定哪个链接应该成为焦点。
var order = new Array("l1", "l2", "l3", "l4");
var current = -1;
function updateCurrent(inc) {
current = (current + inc) % order.length;
current = Math.max(current, 0);
}
document.onkeydown = function(evt) {
evt = evt || window.event;
switch (evt.keyCode) {
case 38:
updateCurrent(-1);
document.getElementById(order[current]).focus();
break;
case 40:
updateCurrent(1);
document.getElementById(order[current]).focus();
}
};
更新了你的脚本。看看这个。小提琴:http: //jsfiddle.net/T8S7c/6/
var myLinks = document.getElementsByTagName("a");
var myLinksIndex = 0;
myLinks[myLinksIndex].focus();
document.onkeydown = function(evt) {
evt = evt || window.event;
switch (evt.keyCode) {
case 38: // Up arrow
if(myLinksIndex > 0){myLinks[-- myLinksIndex].focus();}
break;
case 40:// Down arrow
if(myLinksIndex < myLinks.length){myLinks[++ myLinksIndex].focus();}
break;
}
};