使用jQuery跳转到按下向上或向下键上的上一个或下一个元素

Question

我试图按箭头按下跳跃。我只需要在每次按下向上或向下箭头时触发对下一个或上一个项目的单击，但是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

Answer 1

1. 所以previous（）应该是prev（）。
2. 您需要存储当前活动元素以跳转到下一个或上一个
3. 以下是触发点击链接的方法： 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;
}