jquery - 使用jQuery在向上或向下按键时跳转到上一个或下一个元素

标签 jquery keypress

我正在尝试按箭头键上下跳跃。每次按下向上或向下箭头时,我只需要触发对下一个或上一个项目的点击,但 jQuery 不行。 . .

 $('body').on("keyup", function(e) {

                var code = e.which;
                if (code == 40) {

                 e.preventDefault();    
                // down here
               $('.cv_item').next().trigger( "click" );

                } else if (code == 38) {

                 e.preventDefault();    
                // up here
           $('.cv_item').previous().trigger( "click" );
                }
            });

更新:FIDDLE

最佳答案

  • 所以previous()应该是prev()。
  • 您需要存储当前事件元素以跳转到下一个或上一个
  • 以下是触发链接点击的方法:
    jQuery.trigger('click') not working

  • JSFIDDLE :
    $currentLi = $('.cv_item').last().closest('li');
    
    $('body').on("keyup", function(e) {              
        var code = e.which;
    
        if (code == 40) {
            e.preventDefault();    
          // down here
          $currentLi = $currentLi.next();
          if ( $currentLi.length==0 )
            $currentLi = $('.cv_item').first().closest('li'); 
    
          $('.cv_item').removeClass('active-link');
    
          $link = $currentLi.find('.cv_item');
          $link.addClass('active-link');      
          $link[0].click();
    
            } else if (code == 38) {
            e.preventDefault();    
          // up here
          $currentLi = $currentLi.prev();
          if ( $currentLi.length==0 )
            $currentLi = $('.cv_item').last().closest('li');
    
          $('.cv_item').removeClass('active-link');
    
          $link = $currentLi.find('.cv_item');
          $link.addClass('active-link');      
          $link[0].click();
    
        }
    });
    

    更新:脚本已更改为将 CSS 类添加到 <a>元素和类定义很简单:
    a.active-link {
        color: #0f0;
    }
    

    关于jquery - 使用jQuery在向上或向下按键时跳转到上一个或下一个元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39087494/

    相关文章:

    jquery - 访问通过 Ajax Post 发送到 NodeJS 服务器的数据

    javascript - 触发 ondblClickRow 事件时如何防止 onSelectRow 事件

    c# - 如何检测(Shift+Delete)按键?

    matlab - 在 Matlab 中按下一个键停止无限循环

    javascript - 使用Enter键执行文本字段功能

    javascript - 在 Firefox 中使用 JavaScript 捕获 Tab 键

    jquery - 动态设置特定单元格的颜色

    javascript - 未捕获的类型错误对象没有方法“到顶部滚动条”

    javascript - 如何使用for循环和.append()方法在jQuery中构造表

    c++ - 虚拟键码到 unicode 的映射受写入 std::cout 的影响?