如何使按键触发链接

Question

我正在尝试创建代码，按下按钮将激活href链接。这是我的代码。

HTML：

<a id="#next" href="talonbragg.com">↵</a>
<a id="#previous" href="talonbragg.com">↳</a>

JS：

$(document).ready(function() {
    document.onkeydown = function() 
    {
        var j = event.keyIdentifier
        if (j == "Right")
            window.location = nextUrl
        else if (j == "Left")
            window.location = prevUrl            
    }
});

$(document).ready(function() {
    var nextPage = $("#next")
    var prevPage = $("#previous")
    nextUrl = nextPage.attr("href")
    prevUrl = prevPage.attr("href")
});

有人可以帮忙吗？

Answer 1

这是另一种方法。 您可以在@BestBudds提供的链接中找到关键代码。

我已经像这样更新了您的代码：

＆＃13;

＆＃13;

$(document).keydown(function(e) {
  switch (e.which) {
    case 37: // left
      var href = $('#previous').attr('href');
      window.location.href = href;
      break;

    case 39: // right
      var href = $('#next').attr('href');
      window.location.href = href;
      break;
  }
  e.preventDefault(); 
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a id="#next" href="http://google.com">↵</a>
<a id="#previous" href="http://stackoverflow.com">↳</a>

＆＃13;

＆＃13;

＆＃13;

Answer 2

我会采用不同的方式：

$('body').keypress(function(event) {
                var nextUrl = $('#next').attr('href');
                var previousUrl = $('#previous').attr('href');
                var key = (event.keyCode ? event.keyCode : event.which);
                var left = 37;
                var right = 39;
                if (key == left) {
                     window.location = previousUrl;
                }else if(key == right){
                     window.location = nextUrl;
                }else{return false;}

            });

现在这就是关于按键的说法，当你的网站聚焦时，事件会从键盘上按下键找到键码。

您可以找到关键代码here

之后，如果按下正确的键，你只需要做一些事情。

Answer 3

  

首先不要使用 keyIdentifier ＆＃39;非标准＆＃39; < / strong> AND ＆＃39;已弃用＆＃39; 属性。

由于您使用的是jQuery，因此您可以在e.keyCode || e.which事件中使用keydown，例如：

$('body').on('keydown', function(e){
    var code = e.keyCode || e.which;

    if(code==39)
      $('#next').click();
    else if(code==37)
      $('#previous').click();
})

只需点击相关的锚点即可。

注意：您应该从#删除id，所以它会像：

<a id="next" href="talonbragg.com">↵</a>
<a id="previous" href="talonbragg.com">↳</a>

希望这有帮助。

＆＃13;

＆＃13;

$(document).ready(function() {
  $('body').on('keydown', function(e){
    var code = e.keyCode || e.which;

    if(code==39){
      $('#next').click();
    }else if(code==37){
      $('#previous').click();
    }
  })

  //This part just for debug purpose
  $('a').on('click', function(e){
    e.preventDefault();

    console.log($(this).attr('id')+' Clicked');
  })
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<a id="next" href="talonbragg.com">↵</a>
<a id="previous" href="talonbragg.com">↳</a>

＆＃13;

＆＃13;

＆＃13;