最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
jquery实现键盘监听程序代码
时间:2014-10-16 编辑:简简单单 来源:一聚教程网
例子
代码如下 | 复制代码 |
在应用中绑定事件的监控会更多,如我们利用上下页来实现键盘按左右来实现,下面整理了差不多的例子。
实现效果的逻辑比较简单,也就是slideDown()方法,
Js代码 收藏代码
代码如下 | 复制代码 |
// shows a given element and hides all others function showViaKeypress(element_id) { $(".container").css("display","none"); $(element_id).slideDown("slow"); } // shows proper DIV depending on link 'href' function showViaLink(array) { array.each(function(i) { $(this).click(function() { var target = $(this).attr("href"); $(".container").css("display","none"); $(target).slideDown("slow"); }); }); } |
而对键盘按键的监听是用的keypress()方法,其实也没什么难度,不过我们很少在页面上使用按键监听,这个例子比较新奇,值得我们参考,如有必要时,可以在项目里用用。
Js代码 收藏代码
代码如下 | 复制代码 |
$(document).keypress(function(e) { switch(e.which) { // user presses the "a" case 97: showViaKeypress("#home"); break; // user presses the "s" key case 115: showViaKeypress("#about"); break; // user presses the "d" key case 100: showViaKeypress("#contact"); break; // user presses the "f" key case 102: showViaKeypress("#awards"); break; // user presses the "g" key case 103: showViaKeypress("#links"); } }); |
-
下一个: jquery自动给页面所有图片加链接
相关文章
- jQuery 手风琴效果程序代码 08-02
- jquery点击按钮后变灰实现程序代码 07-16
- jquery操作option程序代码 06-18
- HTML简单购物数量小程序代码展示 10-31
- html canvas实现弹幕功能 10-31
- HTML中空格表示的意义 10-31