设置快捷键
这是一个强健的 Javascript 库用于捕获键盘输入和输入的组合键,它没有依赖,压缩只有只有(~3kb)。hotkey
是临摹大师madrobby/keymaster的作品,只是做了少许更改,添加UMD,和兼容问题。没有fork
的原因是,不仅仅要一句一句的读懂,还要体现出临摹的作用。
__ __ __
| |--..-----.| |_ | |--..-----..--.--..-----.
| || _ || _|| < | -__|| | ||__ --|
|__|__||_____||____||__|__||_____||___ ||_____|
|_____|
创建
您将需要在您的系统上安装的 Node.js。
# bower 安装 $ bower install hotkeysjs # npm 安装 $ npm install hotkeys-js $ npm run build # 编译 $ npm run watch # 开发模式
使用
传统调用
<script type="text/javascript" src="./js/hotkeys.js"></script>
包加载
; ;
定义快捷键
// 定义a快捷键; // 定义a快捷键; // 返回false将停止活动,并阻止默认浏览器事件; // 多个快捷方式做同样的事情; // 对所有摁键执行任务;
支持的键
⇧
, shift
, option
, ⌥
, alt
, ctrl
, control
, command
, ⌘
。
⌘
Command()
⌃
Control
⌥
Option(alt)
⇧
Shift
⇪
Caps Lock(大写)
fn
功能键就是fn(不支持)
↩︎
return/Enter
space
空格键
修饰键判断
可以对下面的修饰键判断 shift
alt
option
ctrl
control
command
,特别注意+
和=
键值相同,组合键设置⌘+=
;
切换快捷键
如果在单页面在不同的区域,相同的快捷键,干不同的事儿,之间来回切换。O(∩_∩)O !
// 一个快捷键,有可能干的活儿不一样哦;;// 你摁 “ctrl+o”组合键// 当scope等于 scope1 ,执行 回调事件打印出 “你好看”,// 当scope等于 scope2 ,执行 回调事件打印出 “你好丑陋啊!”, // 通过setScope设定范围scope hotkeys; // 默认所有事儿都干哦
删除标记快捷键
删除区域范围标记
hotkeys;
解除绑定
hotkeys.unbind("ctrl+o, ctrl+alt+enter")
解除绑定两组快捷键
hotkeys.unbind("ctrl+o","files")
解除绑定名字叫files钟的一组快捷键
键判断
判断摁下的键是否为某个键
;
获取摁下键值
获取摁下绑定键的键值 hotkeys.getPressedKeyCodes()
过滤
INPUT
SELECT
TEXTAREA
默认不处理。
hotkeys.filter
返回 true
快捷键设置才会起作用,flase
快捷键设置失效。
hotkeys{ return true;}//如何增加过滤可编辑标签 <div contentEditable="true"></div>//contentEditable老浏览器不支持滴 hotkeys { var tagName = eventtarget || eventsrcElementtagName; return !tagNameisContentEditable || tagName == 'INPUT' || tagName == 'SELECT' || tagName == 'TEXTAREA';} //hotkeys{ var tagName = eventtarget || eventsrcElementtagName; hotkeys; return true;}
兼容模式
var k = hotkeys;; // -->Uncaught TypeError: hotkeys is not a function(anonymous function) // @ VM2170:2InjectedScript._evaluateOn // @ VM2165:883InjectedScript._evaluateAndWrap // @ VM2165:816InjectedScript.evaluate @ VM2165:682