2016-12-10 36 views
0

我想在按鈕按下時激活一個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") 
}); 

是否有人可以幫忙嗎?

+2

你不能有相同的'id'兩個元素。首先修復你的HTML。 – Michelangelo

回答

0

這是另一種方法。 您可以在@BestBudds提供的鏈接中找到關鍵代碼。

我已經更新了你的代碼是這樣的:

$(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(); 
 
});
<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>

0

我會做不同的方式:

$('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

之後,你只需要如果按正確的鍵做一些事情。

0

所有的先不使用keyIdentifier這是一個'非標' AND '棄用'財產。

由於您使用jQuery的,你可以在使用e.keyCode || e.which上​​事件,如:

$('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> 

希望這有助於。

$(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'); 
 
    }) 
 
});
<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>