滾動頁面使用按鍵不工作使用jQuery？

Question

我嘗試了一些特定的步驟，以便我的頁面能夠通過特定的按鍵。

<div class="navbar navbar-fixed-top"> 
<div class="navbar-inner"> 
    <div class="container"> 
     <ul id="page-navigate" class="nav"> 
      <li><a href="#A" data-link="A" class="current">A</a> 

      </li> 
      <li><a href="#B" data-link="B">B</a> 

      </li> 
      <li><a href="#C" data-link="C">C</a> 

      </li> 
      <li><a href="#D" data-link="D">D</a> 

      </li> 
     </ul> 
     </div> 
    </div> 
</div> 
<section id="A"></section> 
<section id="B"></section> 
<section id="C"></section> 
<section id="D"></section> 

所以，我試着用鍵來上下鍵使用jQuery，這樣我就可以直接到達特定的部分。 守則內的jsfiddle提到：http://jsfiddle.net/coolshivster/qGjA4/2/ 我jQuery代碼是：

  $(document).keyup(function (event) { 
      console.log("keyup is working"); 
      var direction = null; 
      if (event.keyCode == 40) { 
       direction = 'next'; 
      } else if (event.keyCode == 38) { 
       direction = 'prev'; 
       console.log('previous click'); 
      } 
      if (direction != null) { 
       console.log("wake up keys"); 
       $('ul#page-navigate a.current').parent()[direction]().find('a').click(); 
       var link = $('ul#page-navigate a.current').attr('data-link'); 
       console.log('link is', link); 
       $('#' + link + '').slideDown("slow"); 
      } 
     }); 
     $('ul#page-navigate').on('click','a', function() { 
      $(this).parents('ul#page-navigate').find('li').each(function() { 
       $(this).find('a').removeClass('current'); 
      }); 
      $(this).addClass('current'); 
     }); 

現在， 我試着用不同的東西喜歡直接去使用了slideDown使用部分ID的鏈接。 我試圖點擊導航欄錨點的使用click（）函數。 但是，所有失敗或可能是我的代碼中的一些錯誤。

在此先感謝.. !!!

Answer 1

您正在使用不正確的slideDown功能。它用於通過從0px到其正常高度的任何高度將其高度動畫顯示出來。這與滾動無關。

你會想要做一些像this來完成你想要做的事情。請記住，動畫部分是可選的。

下面是一個簡單的，非動畫版：

$('html,body').scrollTop($('#' + link).offset().top)