2011-09-04 4 views
5

내가 이전 및 다음 링크가있는 페이지가 화살표 :이동은 왼쪽을 사용 = 다음과 확인해 = 이전 페이지과 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"> 

는 사용자가 왼쪽을 누를 때 이러한 링크를 탐색하는 자바 스크립트를 사용할 수를 화살표 또는 오른쪽 화살표? 텍스트를 편집하고 왼쪽 또는 오른쪽 화살표를 누르면 링크가 활성화되어서는 안됩니다.

여러 개의 이미지 페이지를보기 쉽게하기 위해 사용됩니다.

답변

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

클릭 라인을 다음과 같이 바꾸십시오. location.href = $ ("a [rel = 'prev']") .prop ("href"); –

+0

하지만 왜'a'입니까? 나는 그것이 질문의'링크'라고 생각한다. – pimvdb