hotkeys-js
Advanced tools
Comparing version 2.0.9 to 3.0.0
@@ -1,3 +0,2 @@ | ||
/*! hotkeys-js v2.0.9 | MIT (c) 2018 kenny wang <wowohoo@qq.com> | https://github.com/jaywcjlove/hotkeys.git */ | ||
!function(e){if("object"==typeof exports&&"undefined"!=typeof module)module.exports=e();else if("function"==typeof define&&define.amd)define([],e);else{("undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self?self:this).hotkeys=e()}}(function(){Array.prototype.indexOf||(Array.prototype.indexOf=function(e){for(var n=0;n<this.length;n++)if(this[n]===e)return n;return-1}),Array.prototype.lastIndexOf||(Array.prototype.lastIndexOf=function(e){for(var n=this.length-1;n>=0;n--)if(this[n]===e)return n;return-1});for(var e,n="undefined"!=typeof navigator&&navigator.userAgent.toLowerCase().indexOf("firefox")>0,t={backspace:8,tab:9,clear:12,enter:13,return:13,esc:27,escape:27,space:32,left:37,up:38,right:39,down:40,del:46,delete:46,ins:45,insert:45,home:36,end:35,pageup:33,pagedown:34,"⇪":20,capslock:20,",":188,".":190,"/":191,"`":192,"-":n?173:189,"=":n?61:187,";":n?59:186,"'":222,"[":219,"]":221,"\\":220},o="all",r={"⇧":16,shift:16,"⌥":18,alt:18,option:18,"⌃":17,ctrl:17,control:17,"⌘":n?224:91,cmd:n?224:91,command:n?224:91},i=[],f={16:"shiftKey",18:"altKey",17:"ctrlKey"},a={16:!1,18:!1,17:!1},l={},d=1;d<20;d++)t["f"+d]=111+d;function s(e){return t[e.toLowerCase()]||e.toUpperCase().charCodeAt(0)}function c(e){o=e||"all"}function u(){return o||"all"}function p(e,n,t){e.addEventListener?e.addEventListener(n,t,!1):e.attachEvent&&e.attachEvent("on"+n,function(){t(window.event)})}function h(e,n,t){var o;if(n.scope===t||"all"===n.scope){for(var r in o=n.mods.length>0,a)(!a[r]&&n.mods.indexOf(+r)>-1||a[r]&&-1===n.mods.indexOf(+r))&&(o=!1);(0!==n.mods.length||a[16]||a[18]||a[17]||a[91])&&!o&&"*"!==n.shortcut||!1===n.method(e,n)&&(e.preventDefault?e.preventDefault():e.returnValue=!1,e.stopPropagation&&e.stopPropagation(),e.cancelBubble&&(e.cancelBubble=!0))}}function g(e,n){for(var t=e.length>=n.length?e:n,o=e.length>=n.length?n:e,r=0;r<t.length;r++)if(-1===o.indexOf(t[r]))return!1;return!0}function y(e){for(var n=e.slice(0,e.length-1),t=0;t<n.length;t++)n[t]=r[n[t].toLowerCase()];return n}function v(e){var n,t;for(e||(e=""),t=(n=(e=e.replace(/\s/g,"")).split(",")).lastIndexOf("");t>=0;)n[t-1]+=",",n.splice(t,1),t=n.lastIndexOf("");return n}function w(e,n,t){var o=v(e),r=[],i=0;for(void 0===t&&(t=n,n="all");i<o.length;i++)r=[],(e=o[i].split("+")).length>1&&(r=y(e)),(e="*"===(e=e[e.length-1])?"*":s(e))in l||(l[e]=[]),l[e].push({shortcut:o[i],scope:n,method:t,key:o[i],mods:r})}for(var m in f[n?224:91]="metaKey",a[n?224:91]=!1,"undefined"!=typeof document&&(p(document,"keydown",function(e){!function(e){var n,t=e.keyCode||e.which||e.charCode,o=l["*"];if(-1===i.indexOf(t)&&i.push(t),93!==t&&224!==t||(t=91),t in a){for(var d in a[t]=!0,r)r[d]===t&&(w[d]=!0);if(!o)return}for(var s in a)a[s]=e[f[s]];if(w.filter.call(this,e)){if(n=u(),o)for(c=0;c<o.length;c++)o[c].scope===n&&h(e,o[c],n);if(t in l)for(var c=0;c<l[t].length;c++)h(e,l[t][c],n)}}(e)}),p(document,"keyup",function(e){!function(e){var n=e.keyCode||e.which||e.charCode,t=i.indexOf(n);t>=0&&i.splice(t,1);93!==n&&224!==n||(n=91);if(n in a)for(var o in a[n]=!1,r)r[o]===n&&(w[o]=!1)}(e)})),e={setScope:c,getScope:u,deleteScope:function(e,n){var t,o,r;for(t in e||(e=u()),l)for(o=l[t],r=0;r<o.length;)o[r].scope===e?o.splice(r,1):r++;u()===e&&c(n||"all")},getPressedKeyCodes:function(){return i.slice(0)},isPressed:function(e){return"string"==typeof e&&(e=s(e)),-1!==i.indexOf(e)},filter:function(e){var n=(e.target||e.srcElement).tagName;return!("INPUT"===n||"SELECT"===n||"TEXTAREA"===n)},unbind:function(e,n){for(var t,o,r=v(e),i=[],f=0;f<r.length;f++){if((t=r[f].split("+")).length>1&&(i=y(t)),e="*"===(e=t[t.length-1])?"*":s(e),n||(n=u()),!l[e])return;for(var a=0;a<l[e].length;a++)(o=l[e][a]).scope===n&&g(o.mods,i)&&(l[e][a]={})}}})w[m]=e[m];if("undefined"!=typeof window){var x=window.hotkeys;w.noConflict=function(e){return e&&window.hotkeys===w&&(window.hotkeys=x),w},window.hotkeys=w}return window.hotkeys=w,w}); | ||
/*! hotkeys-js v3.0.0 | MIT (c) 2018 kenny wong <wowohoo@qq.com> | */ | ||
!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?module.exports=n():"function"==typeof define&&define.amd?define(n):e.hotkeys=n()}(this,function(){"use strict";var e="undefined"!=typeof navigator&&0<navigator.userAgent.toLowerCase().indexOf("firefox");function n(e,n,t){e.addEventListener?e.addEventListener(n,t,!1):e.attachEvent&&e.attachEvent("on"+n,function(){t(window.event)})}function c(e,n){for(var t=n.slice(0,n.length-1),o=0;o<t.length;o++)t[o]=e[t[o].toLowerCase()];return t}function d(e){var n,t;for(e||(e=""),t=(n=(e=e.replace(/\s/g,"")).split(",")).lastIndexOf("");0<=t;)n[t-1]+=",",n.splice(t,1),t=n.lastIndexOf("");return n}function l(e,n){for(var t=e.length<n.length?n:e,o=e.length<n.length?e:n,r=0;r<t.length;r++)if(-1===o.indexOf(t[r]))return!1;return!0}for(var t={backspace:8,tab:9,clear:12,enter:13,return:13,esc:27,escape:27,space:32,left:37,up:38,right:39,down:40,del:46,delete:46,ins:45,insert:45,home:36,end:35,pageup:33,pagedown:34,"\u21ea":20,capslock:20,",":188,".":190,"/":191,"`":192,"-":e?173:189,"=":e?61:187,";":e?59:186,"'":222,"[":219,"]":221,"\\":220},s={"\u21e7":16,shift:16,"\u2325":18,alt:18,option:18,"\u2303":17,ctrl:17,control:17,"\u2318":e?224:91,cmd:e?224:91,command:e?224:91},a=[],u={16:"shiftKey",18:"altKey",17:"ctrlKey"},h={16:!1,18:!1,17:!1},p={},o=1;o<20;o++)t["f"+o]=111+o;u[e?224:91]="metaKey",h[e?224:91]=!1;var r="all",v=function(e){return t[e.toLowerCase()]||e.toUpperCase().charCodeAt(0)};function i(e){r=e||"all"}function g(){return r||"all"}function y(e,n,t){var o=void 0;if(n.scope===t||"all"===n.scope){for(var r in o=0<n.mods.length,h)(!h[r]&&-1<n.mods.indexOf(+r)||h[r]&&-1===n.mods.indexOf(+r))&&(o=!1);(0!==n.mods.length||h[16]||h[18]||h[17]||h[91])&&!o&&"*"!==n.shortcut||!1===n.method(e,n)&&(e.preventDefault?e.preventDefault():e.returnValue=!1,e.stopPropagation&&e.stopPropagation(),e.cancelBubble&&(e.cancelBubble=!0))}}function m(e,n,t){var o=d(e),r=[],i=0;for(void 0===t&&(t=n,n="all");i<o.length;i++)r=[],1<(e=o[i].split("+")).length&&(r=c(s,e)),(e="*"===(e=e[e.length-1])?"*":v(e))in p||(p[e]=[]),p[e].push({scope:n,mods:r,shortcut:o[i],method:t,key:o[i]})}"undefined"!=typeof document&&(n(document,"keydown",function(e){!function(e){var n,t=e.keyCode||e.which||e.charCode,o=p["*"];if(-1===a.indexOf(t)&&a.push(t),93!==t&&224!==t||(t=91),t in h){for(var r in h[t]=!0,s)s[r]===t&&(m[r]=!0);if(!o)return}for(var i in h)h[i]=e[u[i]];if(m.filter.call(this,e)){if(n=g(),o)for(f=0;f<o.length;f++)o[f].scope===n&&y(e,o[f],n);if(t in p)for(var f=0;f<p[t].length;f++)y(e,p[t][f],n)}}(e)}),n(document,"keyup",function(e){!function(e){var n=e.keyCode||e.which||e.charCode,t=a.indexOf(n);if(t<0||a.splice(t,1),93!==n&&224!==n||(n=91),n in h)for(var o in h[n]=!1,s)s[o]===n&&(m[o]=!1)}(e)}));var f={setScope:i,getScope:g,deleteScope:function(e,n){var t=void 0,o=void 0;for(var r in e||(e=g()),p)for(t=p[r],o=0;o<t.length;)t[o].scope===e?t.splice(o,1):o++;g()===e&&i(n||"all")},getPressedKeyCodes:function(){return a.slice(0)},isPressed:function(e){return"string"==typeof e&&(e=v(e)),-1!==a.indexOf(e)},filter:function(e){var n=(e.target||e.srcElement).tagName;return!("INPUT"===n||"SELECT"===n||"TEXTAREA"===n)},unbind:function(e,n){for(var t=d(e),o=void 0,r=[],i=void 0,f=0;f<t.length;f++){if(1<(o=t[f].split("+")).length&&(r=c(s,o)),e="*"===(e=o[o.length-1])?"*":v(e),n||(n=g()),!p[e])return;for(var a=0;a<p[e].length;a++)(i=p[e][a]).scope===n&&l(i.mods,r)&&(p[e][a]={})}}};for(var w in f)m[w]=f[w];if("undefined"!=typeof window){var k=window.hotkeys;m.noConflict=function(e){return e&&window.hotkeys===m&&(window.hotkeys=k),m},window.hotkeys=m}return m}); |
{ | ||
"name": "hotkeys-js", | ||
"version": "2.0.9", | ||
"description": "A simple micro-library for defining and dispatching keyboard shortcuts. It has no dependencies.", | ||
"author": "kenny wang <wowohoo@qq.com>", | ||
"main": "dist/hotkeys.min.js", | ||
"version": "3.0.0", | ||
"main": "index.js", | ||
"scripts": { | ||
"build:test": "browserify test/hotkeys.js | uglifyjs --compress --mangle > test/hotkeys.test.js", | ||
"build:min": "umd hotkeys src/hotkeys.js | uglifyjs -mc | bannerjs -o > dist/hotkeys.min.js", | ||
"build:dist": "umd hotkeys src/hotkeys.js | bannerjs -m | uglifyjs -b beautify=true --comments 'all' > dist/hotkeys.js ", | ||
"build": "npm run build:min && npm run build:dist", | ||
"test": "npm run build:test && ssr", | ||
"watch": "onchange 'src/hotkeys.js' -v -- npm run build " | ||
"build": "node scripts/build.js", | ||
"watch": "node scripts/watch.js", | ||
"pretest": "npm run build", | ||
"test": "jest --coverage", | ||
"test:watch": "jest --watch", | ||
"doc:dev": "NODE_ENV=development parcel website/index.html --out-dir build/website --no-cache", | ||
"doc:build": "NODE_ENV=production parcel build website/index.html --out-dir build/website --public-url ./ --no-cache" | ||
}, | ||
@@ -26,19 +26,31 @@ "keywords": [ | ||
], | ||
"repository": { | ||
"type": "git", | ||
"url": "https://github.com/jaywcjlove/hotkeys.git" | ||
}, | ||
"author": "kenny wong <wowohoo@qq.com>", | ||
"license": "MIT", | ||
"dependencies": {}, | ||
"devDependencies": { | ||
"autoprefixer": "^8.1.0", | ||
"babel-core": "^6.26.0", | ||
"babel-plugin-external-helpers": "^6.22.0", | ||
"babel-preset-env": "^1.6.1", | ||
"babel-preset-react": "^6.24.1", | ||
"bannerjs": "^1.0.5", | ||
"browserify": "^14.4.0", | ||
"jsdom": "^11.1.0", | ||
"onchange": "^3.2.1", | ||
"ssr": "^1.1.1", | ||
"tape": "^4.8.0", | ||
"tape-dom": "0.0.12", | ||
"uglify-js": "^3.0.27", | ||
"umd": "^3.0.1" | ||
}, | ||
"license": "MIT", | ||
"dependencies": {} | ||
"classnames": "^2.2.5", | ||
"colors-cli": "^1.0.13", | ||
"highlight.js": "^9.12.0", | ||
"jest": "^22.4.2", | ||
"less": "^3.0.1", | ||
"parcel-bundler": "^1.6.2", | ||
"parcel-plugin-markdown-string": "^1.3.1", | ||
"postcss-modules": "^1.1.0", | ||
"puppeteer": "^1.2.0", | ||
"react": "^16.2.0", | ||
"react-dom": "^16.2.0", | ||
"react-markdown": "^3.3.0", | ||
"rollup": "^0.57.0", | ||
"rollup-plugin-babel": "^3.0.3", | ||
"rollup-plugin-commonjs": "^9.1.0", | ||
"rollup-plugin-node-resolve": "^3.2.0", | ||
"uglify-js": "^3.3.15", | ||
"zlib": "^1.0.5" | ||
} | ||
} |
290
README.md
@@ -1,10 +0,9 @@ | ||
# 设置快捷键 | ||
# Hotkeys | ||
[![](https://img.shields.io/github/issues/jaywcjlove/hotkeys.svg)](https://github.com/jaywcjlove/hotkeys/issues) [![](https://img.shields.io/github/forks/jaywcjlove/hotkeys.svg)](https://github.com/jaywcjlove/hotkeys/network) [![](https://img.shields.io/github/stars/jaywcjlove/hotkeys.svg)](https://github.com/jaywcjlove/hotkeys/stargazers) [![](https://img.shields.io/github/release/jaywcjlove/hotkeys.svg)](https://github.com/jaywcjlove/hotkeys/releases) | ||
[![](https://img.shields.io/github/issues/jaywcjlove/hotkeys.svg)](https://github.com/jaywcjlove/hotkeys/issues) [![](https://img.shields.io/github/forks/jaywcjlove/hotkeys.svg)](https://github.com/jaywcjlove/hotkeys/network) [![](https://img.shields.io/github/stars/jaywcjlove/hotkeys.svg)](https://github.com/jaywcjlove/hotkeys/stargazers) [![](https://img.shields.io/github/release/jaywcjlove/hotkeys.svg)](https://github.com/jaywcjlove/hotkeys/releases) ![](http://jaywcjlove.github.io/sb/status/no-dependencies.svg) [![Build Status](https://www.travis-ci.org/jaywcjlove/hotkeys.svg?branch=master)](https://www.travis-ci.org/jaywcjlove/hotkeys) [![Coverage Status](https://coveralls.io/repos/github/jaywcjlove/hotkeys/badge.svg?branch=master)](https://coveralls.io/github/jaywcjlove/hotkeys?branch=master) [![jaywcjlove/sb](https://jaywcjlove.github.io/sb/lang/chinese.svg)](./README-zh.md) | ||
这是一个强健的 Javascript 库用于捕获键盘输入和输入的组合键,它没有依赖,压缩只有只有(~3kb),gzip:1.9k。`hotkey` 可以算是临摹参考[madrobby/keymaster](https://github.com/madrobby/keymaster)的作品,重写了一遍,修复多个兼容问题,键支持,添加UMD支持和 **测试用例**,[官方文档DEMO预览](http://jaywcjlove.github.io/hotkeys/?lang=cn) [En](http://jaywcjlove.github.io/hotkeys/?lang=en) | ||
HotKeys.js is an input capture library with some very special features, it is easy to pick up and use, has a reasonable footprint (~3kb) (gzipped: 1.73kb), and has no dependencies. It should not interfere with any JavaScript libraries or frameworks. Official document [demo preview](http://jaywcjlove.github.io/hotkeys). | ||
[![jaywcjlove/sb](https://jaywcjlove.github.io/sb/lang/chinese.svg)](http://jaywcjlove.github.io/hotkeys/?lang=cn) [![jaywcjlove/sb](https://jaywcjlove.github.io/sb/lang/english.svg)](http://jaywcjlove.github.io/hotkeys/?lang=en) | ||
```text | ||
```bash | ||
__ __ __ | ||
@@ -17,28 +16,31 @@ | |--..-----.| |_ | |--..-----..--.--..-----. | ||
## 创建 | ||
## Usage | ||
您将需要在您的系统上安装的 Node.js。 | ||
You will need `Node.js` installed on your system. | ||
```sh | ||
# bower 安装 | ||
$ bower install hotkeysjs | ||
```shell | ||
$ npm install hotkeys-js --save | ||
``` | ||
# npm 安装 | ||
$ npm install hotkeys-js | ||
```js | ||
import hotkeys from 'hotkeys-js'; | ||
``` | ||
$ npm run build # 编译 | ||
$ npm run watch # 开发模式 | ||
Or manually download and link **hotkeys.js** in your HTML: | ||
```html | ||
<script type="text/javascript" src="hotkeys.js"></script> | ||
``` | ||
## React中使用 | ||
### Used in React | ||
[react-hotkeys](https://github.com/jaywcjlove/react-hotkeys),安装如下: | ||
[react-hotkeys](https://github.com/jaywcjlove/react-hotkeys) is the React component that listen to keydown and keyup keyboard events, defining and dispatching keyboard shortcuts. | ||
```sh | ||
npm i -S react-hot-keys | ||
```shell | ||
$ npm install react-hot-keys --save | ||
``` | ||
例子 | ||
Detailed use method please see its documentation [react-hotkeys](https://github.com/jaywcjlove/react-hotkeys). | ||
```js | ||
```jsx | ||
import React, { Component } from 'react'; | ||
@@ -54,13 +56,7 @@ import Hotkeys from 'react-hot-keys'; | ||
} | ||
onKeyUp(keyName, e, handle) { | ||
console.log("test:onKeyUp", e, handle) | ||
this.setState({ | ||
output: `onKeyUp ${keyName}`, | ||
}); | ||
onKeyUp(keyNm, e, handle) { | ||
this.setState({output: keyNm}) | ||
} | ||
onKeyDown(keyName, e, handle) { | ||
console.log("test:onKeyDown", keyName, e, handle) | ||
this.setState({ | ||
output: `onKeyDown ${keyName}`, | ||
}); | ||
this.setState({output: keyNm}) | ||
} | ||
@@ -70,9 +66,7 @@ render() { | ||
<Hotkeys | ||
keyName="shift+a,alt+s" | ||
keyName="shift+a,alt+s" | ||
onKeyDown={this.onKeyDown.bind(this)} | ||
onKeyUp={this.onKeyUp.bind(this)} | ||
> | ||
<div style={{ padding: "50px" }}> | ||
{this.state.output} | ||
</div> | ||
<div style={{ padding: 50 }}> {this.state.output} </div> | ||
</Hotkeys> | ||
@@ -84,36 +78,24 @@ ) | ||
## 使用 | ||
## Browser Support | ||
传统调用 | ||
Mousetrap has been tested and should work in. | ||
```html | ||
<script type="text/javascript" src="./js/hotkeys.js"></script> | ||
```shell | ||
Internet Explorer 6+ | ||
Safari | ||
Firefox | ||
Chrome | ||
``` | ||
包加载 | ||
## Defining Shortcuts | ||
```js | ||
import hotkeys from 'hotkeys-js'; | ||
One global method is exposed, key which defines shortcuts when called directly. | ||
hotkeys('shift+a,alt+d, w', function(e){ | ||
console.log('干点活儿',e); | ||
if(hotkeys.shift) console.log('大哥你摁下了 shift 键!'); | ||
if(hotkeys.ctrl) console.log('大哥你摁下了 ctrl 键!'); | ||
if(hotkeys.alt) console.log('大哥你摁下了 alt 键!'); | ||
}); | ||
``` | ||
## 定义快捷键 | ||
```js | ||
// 定义a快捷键 | ||
hotkeys('f5', function(event,handler){ | ||
//event.srcElement: input | ||
//event.target: input | ||
// 阻止Widnows系统下的默认刷新事件 | ||
hotkeys('f5', function(event, handler){ | ||
// Prevent the default refresh event under WIDNOWS system | ||
event.preventDefault() | ||
alert('你按下了 F5 键!') | ||
alert('you pressed F5!') | ||
}); | ||
// 定义a快捷键 | ||
hotkeys('a', function(event,handler){ | ||
@@ -123,110 +105,86 @@ //event.srcElement: input | ||
if(event.target === "input"){ | ||
alert('你在输入框中按下了 a!') | ||
alert('you pressed a!') | ||
} | ||
alert('你按下了 a!') | ||
alert('you pressed a!') | ||
}); | ||
// 定义a快捷键 | ||
hotkeys('ctrl+a,ctrl+b,r,f', function(event,handler){ | ||
switch(handler.key){ | ||
case "ctrl+a":alert('你按下了ctrl+a!');break; | ||
case "ctrl+b":alert('你按下了ctrl+b!');break; | ||
case "r":alert('你按下了r!');break; | ||
case "f":alert('你按下了f!');break; | ||
case "ctrl+a":alert('you pressed ctrl+a!');break; | ||
case "ctrl+b":alert('you pressed ctrl+b!');break; | ||
case "r":alert('you pressed r!');break; | ||
case "f":alert('you pressed f!');break; | ||
} | ||
//handler.scope 范围 | ||
}); | ||
// 返回false将停止活动,并阻止默认浏览器事件 | ||
hotkeys('ctrl+r', function(){ alert('停止刷新!'); return false }); | ||
// 多个快捷方式做同样的事情 | ||
hotkeys('⌘+r, ctrl+r', function(){ }); | ||
// 对所有摁键执行任务 | ||
hotkeys('*','wcj', function(e){ | ||
console.log('干点活儿',e); | ||
console.log("key.getScope()::",hotkeys.getScope()); | ||
if(hotkeys.shift) console.log('大哥你摁下了 shift 键!'); | ||
if(hotkeys.ctrl) console.log('大哥你摁下了 ctrl 键!'); | ||
if(hotkeys.alt) console.log('大哥你摁下了 alt 键!'); | ||
console.log('do something',e); | ||
}); | ||
``` | ||
## 支持的键 | ||
## API REFERENCE | ||
`⇧`, `shift`, `option`, `⌥`, `alt`, `ctrl`, `control`, `command`, `⌘` | ||
Asterisk "*" | ||
`⌘` Command() | ||
`⌃` Control | ||
`⌥` Option(alt) | ||
`⇧` Shift | ||
`⇪` Caps Lock(大写) | ||
~~`fn` 功能键就是fn(不支持)~~ | ||
`↩︎` return/enter | ||
`space` 空格键 | ||
Modifier key judgments | ||
## 修饰键判断 | ||
可以对下面的修饰键判断 `shift` `alt` `option` `ctrl` `control` `command`,特别注意`+`和`=`键值相同,组合键设置`⌘+=` | ||
```js | ||
hotkeys('shift+a,alt+d, w', function(e){ | ||
console.log('干点活儿',e); | ||
if(hotkeys.shift) console.log('大哥你摁下了 shift 键!'); | ||
if(hotkeys.ctrl) console.log('大哥你摁下了 ctrl 键!'); | ||
if(hotkeys.alt) console.log('大哥你摁下了 alt 键!'); | ||
hotkeys('*','wcj', function(e){ | ||
if(hotkeys.shift) console.log('shift is pressed!'); | ||
if(hotkeys.ctrl) console.log('shift is pressed! '); | ||
if(hotkeys.alt) console.log('shift is pressed! '); | ||
}); | ||
``` | ||
## 切换快捷键 | ||
### setScope | ||
如果在单页面在不同的区域,相同的快捷键,干不同的事儿,之间来回切换。O(∩_∩)O ! | ||
Use the `hotkeys.setScope` method to set scope. | ||
```js | ||
// 一个快捷键,有可能干的活儿不一样哦 | ||
hotkeys('ctrl+o, ctrl+alt+enter', 'scope1', function(){ | ||
console.log('你好看'); | ||
// define shortcuts with a scope | ||
hotkeys('ctrl+o, ctrl+alt+enter', 'issues', function(){ | ||
console.log('do something'); | ||
}); | ||
hotkeys('ctrl+o, enter', 'scope2', function(){ | ||
console.log('你好丑陋啊!'); | ||
hotkeys('o, enter', 'files', function(){ | ||
console.log('do something else'); | ||
}); | ||
// 你摁 “ctrl+o”组合键 | ||
// 当scope等于 scope1 ,执行 回调事件打印出 “你好看”, | ||
// 当scope等于 scope2 ,执行 回调事件打印出 “你好丑陋啊!”, | ||
// 通过setScope设定范围scope | ||
hotkeys.setScope('scope1'); // 默认所有事儿都干哦 | ||
// set the scope (only 'all' and 'issues' shortcuts will be honored) | ||
hotkeys.setScope('issues'); // default scope is 'all' | ||
``` | ||
## 标记快捷键范围 | ||
### getScope | ||
**删除** 区域范围标记 | ||
Use the `hotkeys.getScope` method to get scope. | ||
```js | ||
hotkeys.deleteScope('scope1'); | ||
hotkeys.getScope(); | ||
``` | ||
**获取** 区域范围标记 | ||
### deleteScope | ||
Use the `hotkeys.deleteScope` method to delete set scope. | ||
```js | ||
hotkeys.getScope('scope1'); | ||
hotkeys.deleteScope('issues'); | ||
``` | ||
**设置** 区域范围标记 | ||
### unbind | ||
Similar to defining shortcuts, they can be unbound using `hotkeys.unbind`. | ||
```js | ||
hotkeys.setScope('scope1'); | ||
// unbind 'a' handler | ||
hotkeys.unbind('a'); | ||
// unbind a hotkeys only for a single scope | ||
// when no scope is specified it defaults to the current scope (hotkeys.getScope()) | ||
hotkeys.unbind('o, enter', 'issues'); | ||
hotkeys.unbind('o, enter', 'files'); | ||
``` | ||
## 解除绑定 | ||
### isPressed | ||
`hotkeys.unbind("ctrl+o, ctrl+alt+enter")` 解除绑定两组快捷键 | ||
`hotkeys.unbind("ctrl+o","files")` 解除绑定名字叫files钟的一组快捷键 | ||
Other key queries. For example, `hotkeys.isPressed(77)` is true if the `M` key is currently pressed. | ||
## 键判断 | ||
判断摁下的键是否为某个键 | ||
```js | ||
@@ -240,32 +198,28 @@ hotkeys('a', function(){ | ||
## 获取摁下键值 | ||
### getPressedKeyCodes | ||
获取摁下绑定键的键值 `hotkeys.getPressedKeyCodes()` | ||
returns an array of key codes currently pressed. | ||
```js | ||
hotkeys('command+ctrl+shift+a,f', function(){ | ||
console.log(hotkeys.getPressedKeyCodes()); //=> [17, 65] 或者 [70] | ||
console.log(hotkeys.getPressedKeyCodes()); //=> [17, 65] or [70] | ||
}) | ||
``` | ||
## 过滤 | ||
### filter | ||
`INPUT` `SELECT` `TEXTAREA` 默认不处理。 | ||
`hotkeys.filter` 返回 `true` 快捷键设置才会起作用,`false` 快捷键设置失效。 | ||
`INPUT` `SELECT` `TEXTAREA` default does not handle. | ||
`Hotkeys.filter` to return to the `true` shortcut keys set to play a role, `flase` shortcut keys set up failure. | ||
```javascript | ||
```js | ||
hotkeys.filter = function(event){ | ||
return true; | ||
} | ||
// 如何增加过滤可编辑标签 <div contentEditable="true"></div> | ||
// contentEditable老浏览器不支持滴 | ||
//How to add the filter to edit labels. <div contentEditable="true"></div> | ||
//"contentEditable" Older browsers that do not support drops | ||
hotkeys.filter = function(event) { | ||
var tagName = (event.target || event.srcElement).tagName; | ||
return !(tagName.isContentEditable || | ||
tagName == 'INPUT' || | ||
tagName == 'SELECT' || | ||
tagName == 'TEXTAREA'); | ||
return !(tagName.isContentEditable || tagName == 'INPUT' || tagName == 'SELECT' || tagName == 'TEXTAREA'); | ||
} | ||
// | ||
hotkeys.filter = function(event){ | ||
@@ -278,15 +232,65 @@ var tagName = (event.target || event.srcElement).tagName; | ||
## 兼容模式 | ||
### noConflict | ||
Relinquish HotKeys’s control of the `hotkeys` variable. | ||
```js | ||
var k = hotkeys.noConflict(); | ||
k('a', function() { | ||
console.log("这里可以干一些事儿") | ||
console.log("do something") | ||
}); | ||
hotkeys() | ||
// -->Uncaught TypeError: hotkeys is not a function(anonymous function) | ||
// @ VM2170:2InjectedScript._evaluateOn | ||
// @ VM2165:883InjectedScript._evaluateAndWrap | ||
// -->Uncaught TypeError: hotkeys is not a function(anonymous function) | ||
// @ VM2170:2InjectedScript._evaluateOn | ||
// @ VM2165:883InjectedScript._evaluateAndWrap | ||
// @ VM2165:816InjectedScript.evaluate @ VM2165:682 | ||
``` | ||
## Supported Keys | ||
HotKeys understands the following modifiers: `⇧`, `shift`, `option`, `⌥`, `alt`, `ctrl`, `control`, `command`, and `⌘`. | ||
The following special keys can be used for shortcuts: backspace, tab, clear, enter, return, esc, escape, space, up, down, left, right, home, end, pageup, pagedown, del, delete and f1 through f19. | ||
`⌘` Command() | ||
`⌃` Control | ||
`⌥` Option(alt) | ||
`⇧` Shift | ||
`⇪` Caps Lock(Capital) | ||
~~`fn` Does not support fn~~ | ||
`↩︎` return/Enter space | ||
## Development | ||
To develop, run the self-reloading build, Get the code: | ||
```shell | ||
$ git https://github.com/jaywcjlove/hotkeys.git | ||
$ cd hotkeys # Into the directory | ||
$ npm install # or yarn install | ||
``` | ||
To develop, run the self-reloading build: | ||
```shell | ||
$ npm run watch | ||
``` | ||
Run Document Website Environment. | ||
```shell | ||
$ npm run doc:dev | ||
``` | ||
To contribute, please fork Hotkeys.js, add your patch and tests for it (in the `test/` folder) and submit a pull request. | ||
```shell | ||
$ npm run test | ||
$ npm run test:watch # Development model | ||
``` | ||
## License | ||
[MIT © Kenny Wong](./LICENSE) |
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
Environment variable access
Supply chain riskPackage accesses environment variables, which may be a sign of credential stuffing or data theft.
Found 1 instance in 1 package
No repository
Supply chain riskPackage does not have a linked source code repository. Without this field, a package will have no reference to the location of the source code use to generate the package.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
234966
43
1509
290
24
2
1