在Wordpress的文章页面获取上一页及下一页的链接URL地址，实现通过键盘的前进后退键进行翻页 ...

本是古典何须时尚 2022-04-15 00:29 213阅读 0赞

先说明一下，我使用的WORDPRESS版本是3.4.1，使用的模板主题是[NeoEase][] 开发的iNove，可以点击[这里][Link 1] 进 行下载。我之所以想要在文章页面获取上一下及下一页的地址，只是想要实现一个功能，增加使用键盘的前进"->"及后退"<-"按钮进行翻页的 功能，这个功能虽然简单，但是却比较实用，可以省去我拖拉页面到底部，然后再去点击下一页的时间，以下我就讲一下我的实现步骤。打开主题页面下的 single.php这个文件，找到以下内容：

**\[php\]** [view plain][] [copy][view plain]

1.  <div id= "postnavi" >  
2.      <span class = "prev" ><?php next\_post\_link( '%link' ) ?></span>  
3.      <span class = "next" ><?php previous\_post\_link( '%link' ) ?></span>  
4.      <div class = "fixed" ></div>  
5.  </div>

将其修改为：

**\[php\]** [view plain][] [copy][view plain]

1.  <div id= "postnavi" >  
2.      <span class = "prev"  id= "prePage" ><?php next\_post\_link( '%link' ) ?></span>  
3.      <span class = "next"  id= "nextPage" ><?php previous\_post\_link( '%link' ) ?></span>  
4.      <div class = "fixed" ></div>  
5.  </div>

在文件的末尾增加如下JS：

**\[javascript\]** [view plain][] [copy][view plain]

1.  <script language= "javascript" >  
2.      document.οnkeydοwn=gotoPage;  
3.      var  preUrl = document.getElementById( "prePage" ).innerHTML.toLowerCase();  
4.      var  start = preUrl.indexOf( 'http' );  
5.      var  end = preUrl.indexOf( '" rel' );  
6.      preUrl = preUrl.substring(start,end);  
7.        
8.      var  nextUrl = document.getElementById( "nextPage" ).innerHTML.toLowerCase();  
9.      var  start = nextUrl.indexOf( 'http' );  
10.     var  end = nextUrl.indexOf( '" rel' );  
11.     nextUrl = nextUrl.substring(start,end);  
12.     function  gotoPage(event)   
13.     \{  
14.         event = event ? event : (window.event ? window.event : null );  
15.         if  (event.keyCode==37)   
16.         \{  
17.             if  (preUrl!= '' )\{  
18.                 window.location=preUrl;  
19.             \}  
20.             else \{  
21.                 alert('This is already the first page."' );  
22.             \}  
23.         \}  
24.         if  (event.keyCode==39)   
25.         \{  
26.             if  (nextUrl!= '' )\{  
27.                 window.location=nextUrl;  
28.             \}  
29.             else \{  
30.                 alert('This is already the last page."' );  
31.             \}  
32.         \}  
33.     \}  
34. </script>

OK，搞定收工，这下就可能通过键盘的前进后退键进行翻页了。

本文出自：**[冯立彬的博客][Link 2]** ([http://www.fenglibin.com][Link 2] )，原文地址：[http://www.fenglibin.com/get\_pre\_and\_next\_page\_url\_in\_wordpress.html][http_www.fenglibin.com_get_pre_and_next_page_url_in_wordpress.html]

[NeoEase]: http://www.neoease.com/
[Link 1]: http://wordpress.org/extend/themes/download/inove.1.4.6.zip
[view plain]: http://blog.csdn.net/fenglibing/article/details/7758266
[Link 2]: http://www.fenglibin.com
[http_www.fenglibin.com_get_pre_and_next_page_url_in_wordpress.html]: http://www.fenglibin.com/get_pre_and_next_page_url_in_wordpress.html