Question

我的html包含元素列表。我想使用箭头键来选择元素。

以下是我的代码：[http://jsfiddle.net/T8S7c/]

我想要的是预备焦点需要在所选元素中的键，如悬停效果。（例如，如果我第一次按下向下键，Ambaji必须聚焦）

我知道关键事件的代码，但我不知道如何把重点放在按键上。

任何人都可以帮助我

Answer 1

我解决这个问题的策略是通过链接数组指定焦点顺序，并指定一些变量来指定哪个链接应该是焦点。

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();
    }
};

Answer 2

更新了您的脚本。看看这个。小提琴：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;
    }
};

如何使用keyarrows获取javascript中元素的焦点

2 个答案: