带有导航菜单的键盘快捷键

Question

可能有人可以将我的代码与键盘按键集成在一起，以便以尽可能少的代码来进行上下导航（我的网站足够繁重！）。 我尝试了一些插件并进行了大量搜索，但是我的小经验对我没有帮助！

$(function() {
$('ul.nav a').each(function(i, elem) {
    $(elem).bind('click', function(event) {
        event.preventDefault();
        var offset = i * 38;
        $('ul.nav').stop().animate({backgroundPosition: '0 ' + offset + 'px'}, 2000,'easeOutQuart');

        var $anchor = $(this);
        $('html, body').stop().animate({
            scrollTop: $($anchor.attr('href')).offset().top
        }, 2000,'easeOutQuart');
            $('ul.nav a').css({'cursor': 'pointer', 'color': '#643D21'});
            $anchor.css({'cursor': 'default', 'color': '#995D32'});
        event.preventDefault();
    });
});
});

HTML代码

    <ul class="nav">
    <li><a href="#what">what</a></li>
    <li><a href="#who">who</a></li>
    <li><a href="#portfolio">portfolio</a></li>
    <li><a href="#contact">contact</a></li>
</ul>

感谢，

Answer 1

如果您只想将“ 1”上的按键映射为“ #what”，则可以执行以下操作：

$("document").keypress(function(event) {
  if ( event.which == XX ) {
     location.href="#what";
   }

一种替代方法是给您的链接一个id =“”并使用

$('#<ID OF ELEMENT>').click();

代替

location.href="#what";

XX是您的键的keypress值。 对于“ 1”，它是50。您可以使用此站点在最下面的示例中找出该键具有什么值。 将光标放在输入字段中，然后按一个键。 在输出中查找“哪个”。

另请注意，这适用于页面上任何位置的按键。 如果您想将其限制在鼠标停留在某个元素上时，请将$（'document'）修改为应该在其中激活按键事件的任何元素。