Question

长期没有参与此活动，请原谅任何明显的失误

    switch (event.keyCode) {
case 38:
    $("div.sseholdh").removeClass(function(){
    alert($(this).next().attr("title")); // doesn't alert
    $(this).next().addClass('sseholdh');
    return 'sseholdh';
    }); // does remove the class , but doesn't add it to the next sibling
break;
...
default:
    $("div.ssehold:eq(0)").addClass("sseholdh"); // does work
} // switch keycode

html看起来像这样：

<div class="sshold">
  <div title="entry 1" class="ssehold"> entry 1 </div>
  <div title="entry 2" class="ssehold"> entry 2 </div>
...
</div>

Answer 1

如果我是你，我会开始为你的div提供一个独特的ID。也许这只是个人偏好，但我觉得它更容易。

接下来我会抛弃你的所有代码（从交换机内部开始）并从这开始：

switch（event.keycode）{ 案例38：警报（'Hello World。'）; }

检查是否有效。也许只是你的开关无法正常工作。我查了一下，keyode 38是“L”正确吗？

（这可能不是我知道的最佳答案，但我不能发表评论所以这是现在唯一的方法）

Answer 2

为什么不将您的javascript更改为以下内容 - 无需在removeClass()函数中添加该类：

switch (event.keyCode) {
    case 38:
        $("div.sseholdh").removeClass('sseholdh').next().addClass('sseholdh');
        break; //...
    default:
        $("div.ssehold:eq(0)").addClass("sseholdh"); // does work
} // switch keycode

编辑：用于测试的基本jsFiddle：http://jsfiddle.net/greglockwood/wy9ZX/

编辑2：这是一个更完整的版本，似乎正在尝试使用actual site上的标记：

        switch (event.keyCode) {
        case 38:
            // up arrow
            var highlight = $("div.sseholdh");
            // if nothing highlighted already, highlight the bottom entry
            if (!highlight.length) {
                $('div.ssehold:last').addClass('sseholdh');
            } else {
                // otherwise, change to the previous entry
                highlight.removeClass('sseholdh').prevAll('.ssehold:first').addClass('sseholdh');
            }
            break;
        case 40:
            // down arrow
            var highlight = $("div.sseholdh");
            // if nothing highlighted, select the first entry
            if (!highlight.length) {
                $('div.ssehold:first').addClass('sseholdh');
            } else {
                // otherwise, move the highlight down
                highlight.removeClass('sseholdh').nextAll('.ssehold:first').addClass('sseholdh');
            }
            break;
        default:
            // nothing here, I'm assuming you only want to move the highlight with the arrow keys
        } // switch keycode

jsFiddle在这里更新：http://jsfiddle.net/greglockwood/wy9ZX/2/

（jquery）键盘导航无法正常工作

2 个答案: