我没有足够的代表将图像添加到我要尝试执行的操作中,但是我将尝试尽可能明确。

我想创建这样的东西-

div "1" selected from left nav, right nav shows A,B,C,D

|'''''''''''''''|''''''''''''''''''''''''''''''''''''''|
|               |                                    1 |
|  |'''''''|    |       |'''''|           |'''''|      |
|  |...1...|    |       |  A  |           |  C  |      |
|               |       |.....|           |.....|      |
|  |'''''''|    |                                      |
|  |...2...|    |                                      |
|               |       |'''''|           |'''''|      |
|  |'''''''|    |       |  B  |           |  D  |      |
|  |...3...|    |       |.....|           |.....|      |
|               |                                      |
|...............|......................................|

div "2" selected from left nav, right nav shows E,F,G,H

    |'''''''''''''''|''''''''''''''''''''''''''''''''''''''|
    |               |                                    2 |
    |  |'''''''|    |       |'''''|           |'''''|      |
    |  |...1...|    |       |  E  |           |  G  |      |
    |               |       |.....|           |.....|      |
    |  |'''''''|    |                                      |
    |  |...2...|    |                                      |
    |               |       |'''''|           |'''''|      |
    |  |'''''''|    |       |  F  |           |  H  |      |
    |  |...3...|    |       |.....|           |.....|      |
    |               |                                      |
    |...............|......................................|

我有2个div,leftNavigation和rightNavigation。

leftNavigation有3个div作为按钮。
现在,我只想使用箭头键浏览这个网站。 (上下左右)

我可以使用-捕捉事件
$(document).keydown(function(e) {
    switch(e.which) {
        case 37: // left
        break;

        case 38: // up
        break;

        case 39: // right
        break;

        case 40: // down
        break;

        default: return; // exit this handler for other keys
    }
    e.preventDefault(); // prevent the default action (scroll / move caret)
});

现在我的问题是-

在同时处理左右导航的情况下如何使用这些键盘事件?

例如当leftNav处于焦点时,向上/向下键应仅从leftNavigation中选择div。
当rightNav成为焦点时,向上/向下键应仅从右侧导航中选择div?

最佳答案

这是您想要的吗?

if($.contains( $('.leftNavigation'), $(':focus')) // left col has focus
else if($.contains( $('.rightNavigation'), $(':focus')) // right col has focus

假设您的列分别具有.leftNavigation和.rightNavigation类

10-01 00:58
查看更多