2011-09-04 46 views
5

我有上一頁和下一頁鏈接的頁面:導航使用左邊的rel =未來和rel =上一頁和右箭頭

<link rel="prev" href="http://camera.phor.net/cameralife/photos/11096&#63;referer=index.php"> 
<link rel="next" href="http://camera.phor.net/cameralife/photos/5679&#63;referer=index.php"> 

是否有可能使用Javascript來瀏覽這些鏈接,如果用戶按下左箭頭或右箭頭?如果鏈接正在編輯文本,並且按下向左或向右箭頭,則鏈接不應激活。

這將用於簡化查看幾個圖像頁面。

回答

4

沒有jQuery:http://jsfiddle.net/UXPLt/1/

document.onkeyup = function(e) { // key pressed 
    if(document.activeElement.nodeName === "INPUT" 
    || document.activeElement.nodeName === "TEXTAREA") { 
     return; // abort if focusing input box 
    } 

    var elems = document.getElementsByTagName("link"), 
     links = {}; 

    for(var i = 0; i < elems.length; i++) { // filter link elements 
     var elem = elems[i]; 
     if(elem.rel === "prev") { // add prev to links object 
      links.prev = elem; 
     } else if(elem.rel === "next") { // ad next to links object 
      links.next = elem; 
     } 
    } 

    if(e.keyCode === 37) { // left key 
     location.href = links.prev.href; 
    } else if(e.keyCode === 39) { // right key 
     location.href = links.next.href; 
    } 
}; 
+0

真棒!謝謝 –

4
$(document).keydown(function(e){ 
     if (e.keyCode == 37) { // left 
      $("a[rel='prev']").click(); 
      return false; 
     } else if (e.keyCode == 39) { // right 
      $("a[rel='next']").click(); 
      return false; 
     } 
    }); 
+0
+0

因此,將點擊線替換爲如下所示: location.href = $(「a [rel ='prev']」).prop(「href」); –

+0

但爲什麼'a'?我認爲這是問題的「鏈接」。 – pimvdb

相關問題