jQuery collection plugin that triggers events for common accessibility keys, e.g. enter, space, esc, arrows for keydown
and keyup
events. If you only require keydown
events, please use jquery-common-keydown instead.
$(collection).commonKeys();
This plugin is still in an experimental state, until it reaches v1.0.0 you must consider all minor releases as breaking changes. Patch releases may introduce new features, but will be backwards compatible. Until v1.0.0 release, please use the caret range specifier in your package.json to pin to a fixed minor version.
npm install jquery-common-keys
<ul class="widget">
<li><button>Button 1</button></li>
<li><button>Button 2</button></li>
<li><button>Button 3</button></li>
</ul>
// non-delegated event listener
$('.widget').commonKeys().on('spaceKeyDown enterKeyUp', function(e) {
// this = ul
// e.target = button
});
// delegated event listener
$('.widget').commonKeys().on('spaceKeyDown enterKeyUp', 'button', function(e) {
// this = button
// e.target = button
});
-
enterKeyDown
-
escapeKeyDown
-
spaceKeyDown
-
pageUpKeyDown
-
pageDownKeyDown
-
endKeyDown
-
homeKeyDown
-
leftArrowKeyDown
-
upArrowKeyDown
-
rightArrowKeyDown
-
downArrowKeyDown
-
enterKeyUp
-
escapeKeyUp
-
spaceKeyUp
-
pageUpKeyUp
-
pageDownKeyUp
-
endKeyUp
-
homeKeyUp
-
leftArrowKeyUp
-
upArrowKeyUp
-
rightArrowKeyUp
-
downArrowKeyUp
$.fn.commonKeys.keyCodes = {
ENTER: 13,
ESCAPE: 27,
SPACE: 32,
PAGEUP: 33,
PAGEDOWN: 34,
END: 35,
HOME: 36,
LEFTARROW: 37,
UPARROW: 38,
RIGHTARROW: 39,
DOWNARROW: 40
};
Run npm start
for test driven development. All tests are located in test.js
.
Execute npm run
to view all available CLI scripts:
npm start
test driven development: watches code and re-tests after any changenpm test
runs tests & generates reports (see reports section below)npm run lint
lints code and reports to jshint.txtnpm run minify
builds minified version of codenpm run build
cleans, lints, tests and minifies (called onnpm prepublish
hook)npm run clean
deletes all generated test reports and coverage files
Each test run will generate the following reports:
/test_reports/coverage
contains Istanbul code coverage report/test_reports/html
contains HTML test report/test_reports/junit
contains JUnit test report
https://travis-ci.org/ianmcburnie/jquery-common-keys
https://coveralls.io/github/ianmcburnie/jquery-common-keys?branch=master