[原创]Javascript 利用mousetrap.js进行键盘事件操作
我们日常开发中，会遇到js的键盘操作，例如回车提交表单之类的。或者按下某个键执行某个方法。无意中发现一个大小不到4K的js文件，它非常方便的操作键盘事件。
自己也尝试了一下：具体代码如下：
详情可以去其逛网查看其API并下载，地址：http://craig.is/killing/mice
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="js/mousetrap.min.js" type="text/javascript"></script>
<script src="js/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
Mousetrap.bind('4', function () { alert("按下了4键"); });Mousetrap.bind('enter', function () { alert("按下了enter键"); });
Mousetrap.bind('x', function () { alert("按下了x键"); }, 'keyup');Mousetrap.bind('shift+k', function (e) {
alert("按下了组合键shift+k");
return false;
});});</script>
</head>
<body>
</body>
</html>效果图：
特此记录一下。方便以后查找，也希望给刚刚好有此需要的人带了一些帮助。
PS：当然也还有其它JS库选择，如Keyboard.js,地址：https://github.com/RobertWHurst/KeyboardJS，但个人感觉这个文件体积较大有20多K。 所以没有太多特殊需求的话，推荐mousetrap.js
[原创]Javascript 利用mousetrap.js进行键盘事件操作的更多相关文章
- js浏览器键盘事件控制(转自新浪微博)
js键盘事件全面控制 主要分四个部分第一部分:浏览器的按键事件第二部分:兼容浏览器第三部分:代码实现和优化第四部分:总结 第一部分:浏览器的按键事件 用js实现键盘记录,要关注浏览器的三种按键事件类型 ...
- JS获取键盘事件
<script type="text/javascript" language=JavaScript charset="UTF-8"> docume ...
- 初识 jquery.simulate.js 模拟键盘事件
用jquery 和 jquery.simulate.js 实现模拟键盘事件,点击上下左右div相当于点击键盘的上下左右键 <!DOCTYPE html> <html> < ...
- JS模拟键盘事件 -- 原理及小例子
提问: 键盘默认事件,比如tab切换,alt+f4关闭,ctrl+t新建等,如果不想通过键盘而是一些按钮点击来触发这些功能,该咋办呢? 例子: 先以tab为例上一个小例子: <!DOCTYPE ...
- js/jquery键盘事件及keycode大全
js/jquery的键盘事件分为keypress.keydown和keyup事件 一.键盘事件 1.keydown()事件当按钮被按下时,发生 keydown 事件. 2.keypress()事件ke ...
- [转]js的键盘事件
类型 键盘事件用来描述键盘行为,主要有keydown.keypress.keyup三个事件 keydown 当用户按下键盘上的任意键时触发,如果按住不放的话,会重复触发该事件 <div id=& ...
- kibo.js 处理键盘事件的Javascript工具库
这个也是做在线编辑用到的 选中文字快捷键.提高编辑效率 https://github.com/marquete/kibo 用法很简单 Examples var k = new Kibo(); Sing ...
- 几个常用的JS鼠标键盘事件例子
首先普及一下鼠标左右键值的相关方法: 1.event.x 鼠标横轴 2.event.y 鼠标纵轴 3.event.keycode 键盘值 4.events.button==0 默认.没有按任何按 ...
- 【原生JS】键盘事件
视频播放器音量调节效果. 效果图:“我很丑!~可是我有音乐和啤酒!~” HTML: <!DOCTYPE html> <html> <head> <meta c ...
随机推荐
- Kattis - triangle 【数学】
题意 求第N个迭代三角形 中 所有黑色三角形的周长的整数部分的位数 思路 该三角形的周长是 3^(n + 1)/ 2 ^ (n) 然后 可以用 long double 存下来 再求位数 就可以 AC ...
- c的详细学习（10）结构体与共用体的学习（二）
在c语言中,结构体数据类型与共用体数据类型都属于构造类型.共用体与结构体数据类型在定义上十分相似,但它们在存储空间的占用分配上有本质的区别.结构体变量是各种类型数据的集合,各成员占据不同的存储空间,而 ...
- 20145229吴姗珊 《Java程序设计》第8周学习总结
20145229吴姗珊 <Java程序设计>第8周总结 教材学习内容总结 第十四章 NIO与NIO2 NIO: InputStream.OutputStream的输入输出,基本上是以字节为 ...
- Spring Cloud2.0之整合Consul作为注册中心
使用Consul来替换Eureka Consul简介 Consul 是一套开源的分布式服务发现和配置管理系统,由 HashiCorp 公司用 Go 语言开发. 它具有很多优点.包括: 基于 raft ...
- java:maven中webapp下的jsp不能访问web-inf下面的bean
java:maven中webapp下的jsp不能访问web-inf下面的bean 当然 WEB-INF下面的文件是不能访问的,只能吧jsp文件放入到WEB-INF下面,然后通过配置WEB-INF下we ...
- Git之Eclipse提交项目到Github并实现多人协作
一.Eclipece提交项目到Github 见 eclipse提交项目到github 二.利用github组织实现多人协作 1.新建组织: New organization
- 在开发环境中，自己搭建一个ssl环境（小例子）
做项目的时候自己总结的一些小例子 public class Test { public static void setSSLProperty() { Security.addProvider(new ...
- 用VLC做流媒体服务器
VLC确切来说只是个播放器,是videolan的开源产品,videolan原来还有一个VLM,是服务器端,专门用来做流媒体服务器的,但是现在VLM的功能已经都集成进VLC了,所以也就可以用VLC来做流 ...
- 关于对H264码流的TS的封装的相关代码实现
1 写在开始之前 在前段时间有分享一个H264封装ps流到相关文章的,这次和大家分享下将H264封装成TS流到相关实现,其实也是工作工作需要.依照上篇一样,分段说明每个数据头的封装情况,当然,一样也会 ...
- FJOI2016 神秘数
题目大意 给定长为$N$一个序列,每次询问一个区间,求最小的不能表示为由区间内若干个(可以是$0$个)数的和的非负整数. 考虑一个可重集合$S$,设抽取$S$中若干个数相加无法得到的最小非负整数为$A ...