设置快捷键
这是一个强健的 Javascript 库用于捕获键盘输入和输入的组合键,它没有依赖,压缩只有只有(~3kb),gzip:1.9k。hotkey
可以算是临摹参考madrobby/keymaster的作品,重写了一遍,修复多个兼容问题,键支持,添加UMD支持和 测试用例,官方文档DEMO预览 En
__ __ __ | |--..-----.| |_ | |--..-----..--.--..-----. | || _ || _|| < | -__|| | ||__ --| |__|__||_____||____||__|__||_____||___ ||_____| |_____|
创建
您将需要在您的系统上安装的 Node.js。
# npm 安装 $ npm install hotkeys-js-alex $ npm run build # 编译 $ npm run watch # 开发模式
使用
传统调用
包加载
; ;
定义快捷键
// 定义a快捷键;// 定义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设定范围scopehotkeys; // 默认所有事儿都干哦
标记快捷键范围
删除 区域范围标记
hotkeys;
获取 区域范围标记
hotkeys;
设置 区域范围标记
hotkeys;
解除绑定
hotkeys.unbind("ctrl_o, ctrl_alt_enter")
解除绑定两组快捷键
hotkeys.unbind("ctrl_o","files")
解除绑定名字叫files钟的一组快捷键
键判断
判断摁下的键是否为某个键
;
获取摁下键值
获取摁下绑定键的键值 hotkeys.getPressedKeyCodes()
过滤
INPUT
SELECT
TEXTAREA
默认不处理。
hotkeys.filter
返回 true
快捷键设置才会起作用,false
快捷键设置失效。
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