当前位置:首页 » 代码教程 » 用jquery实现键盘左右翻页功能的方法

用jquery实现键盘左右翻页功能的方法

    jQuery实现网页上键盘左右方向键翻页代码,我们在很多小说网站经常看到这样的效果,这样可以给网站提高用户体验,方便访客翻页使用,从而大大提高了网站PV浏览量,一个不错的效果,如果您的网站已经引入了jQuery框架,不妨增加这个网页上键盘左右方向键翻页功能。jquery键盘左右翻页,jquery键盘方向键翻页功能,当无上一篇或者下一篇的时候,按键盘将会没什么反应,避免错误跳转。
html代码:
<p>上一篇:<a id="pre" href="http://www.shuyong.net/550.html">品质生活,健康人生 - OBH气泡水机助你打造家庭</a></p> 
<p>下一篇:<a id="next" href="http://www.shuyong.net/432.html">[Emlog模板]蓝色经典主题 - 响应式</a></p> 
jquery代码:
$(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; 
    }); 
 }); 
演示效果请用键盘左右测试本站
End
温馨提示:如果您对本文有疑问,请在本页留言即可!!!
觉得很赞 (0)付款方式
X
付款方式:
  • 微信
  • 支付宝
  • QQ红包

使用微信扫一扫
blogger
    发布日期:2014-12-21   所属类别:代码教程   浏览:7338次   评论:3次
    本文地址:http://www.shuyong.net/chengxu/563.html [ 百度已收录 ]
    声明:本页信息由网友自行发布或来源于网络,真实性、合法性由发布人负责,请仔细甄别!本站只为传递信息,我们不做任何双方证明,也不承担任何法律责任。文章内容若侵犯你的权益,请联系本站删除!

留言/评论:◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

填写好QQ号码,任点空白处自动获取

昵称

邮箱

网址

2楼、清萍剑客 [回复该留言]
2016-01-20 13:23
用上了,非常感谢。
1楼、李明 [回复该留言]
2014-12-21 23:35
冬至快乐。
舍力 [回复该留言]
2014-12-22 02:47
@李明:同乐!

个人资料

舍力

博主:舍力

Emlog交流群

    简单的道理,复杂的人生!

博客统计

  • 文章数量:1133篇
  • 文章评论:3520条
  • 总访问量:10300559次
  • 微语数量:81条
  • 在线人数:1人
  • 本站运行:11年2月28天
  • 估计博主很忙,已经很久没更新了!
Q2 虚位以待
Copyright © 2024 舍力博客 版权所有   粤ICP备11021420号
基于宝塔面板,数据存储于阿里云ECS
Powered by emlog / &Author 舍力博客.