點選左右方向鍵實現翻頁效果

本文分享一個簡短的程式碼例項，它實現了點選左右方向鍵實現翻頁效果。

程式碼例項如下:

下面是html程式碼如下:

[HTML] 純文字檢視 複製程式碼
<p>上一篇:<a id='pre' href='http://www.softwhy.com/a.html'>螞蟻部落歡迎您</a></p> 
<p>下一篇:<a id='next' href='http://www.softwhy.com/b.html'>螞蟻部落的url地址是softwhy.com</a></p>

jQuery程式碼如下:

[JavaScript] 純文字檢視 複製程式碼
$(document).ready(function(){ 
  var prevpage=$("#pre").attr("href"); 
  var nextpage=$("#next").attr("href"); 
  $("body").keydown(function(event){ 
   if(event.keyCode==37 && prevpage!=undefined) location=prevpage; 
   if(event.keyCode==39 && nextpage!=undefined) location=nextpage; 
  }); 
 });

程式碼註釋:

（1）.$(document).ready(function(){})，當文件內容完全加贊完畢再去執行函式中的程式碼。

（2）.var prevpage=$("#pre").attr("href"),獲取上一頁的地址。

（3）.var nextpage=$("#next").attr("href"),獲取下一頁的地址。

（4）.$("body").keydown(function(event){ })，為body註冊keydown事件處理函式。

（5）.if(event.keyCode==37 && prevpage!=undefined) location=prevpage，如果點選方向鍵左鍵，那麼就返回上一頁。

（6）.if(event.keyCode==39 && nextpage!=undefined) location=nextpage，如果點選方向鍵右鍵，那麼就進入下一頁。

相關閱讀:

（1）.attr()方法可以參閱jQuery attr()一章節。

（2）.keydown可以參閱jQuery keydown 事件一章節。

（3）.keyCode可以參閱javascript keyCode屬性一章節。