Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Making filtering text inputs easy / simple again #61

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 5 additions & 7 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
# jQuery.Hotkeys [![Build Status](https://secure.travis-ci.org/jeresig/jquery.hotkeys.png)](http://travis-ci.org/jeresig/jquery.hotkeys)

#About
# About

**jQuery Hotkeys** is a plug-in that lets you easily add and remove handlers for keyboard events anywhere in your code supporting almost any key combination.

This plugin is based off of the plugin by Tzury Bar Yochay: [jQuery.hotkeys](https://github.com/tzuryby/jquery.hotkeys)
Expand Down Expand Up @@ -74,19 +75,16 @@ Modifiers are not case sensitive (`Ctrl` == `ctrl` == `cTRL`)

If you want to use more than one modifier (e.g. `alt+ctrl+z`) you should define them by an alphabetical order e.g. alt+ctrl+shift

Hotkeys aren't tracked if you're inside of an input element (unless you explicitly bind the hotkey directly to the input). This helps to avoid conflict with normal user typing.

You can use namespacing by adding a suffix to the event type (e.g. `keyup.toggle`)


## Hotkeys within inputs
### Hotkeys within inputs

Hotkeys aren't tracked if the user is focused within an input element or any element that has `contenteditable="true"` unless you bind the hotkey directly to the element. This helps to avoid conflict with normal user typing.
Hotkeys aren't tracked if the user is focused within an input element (i.e. ``<input>`` of any text-accepting type, ``<select>`` or ``<textarea>``) or any element that has `contenteditable="true"`, unless you bind the hotkey directly to the element. This helps to avoid conflict with normal user typing.
If you don't want this, you can change the booleans of the following to suit:

* `jQuery.hotkeys.options.filterInputAcceptingElements`
* `jQuery.hotkeys.options.filterTextInputs`
* `jQuery.hotkeys.options.filterContentEditable`
* `jQuery.hotkeys.options.filterTextInputs` (deprecated, will be removed in a later version)

### Meta and Hyper Keys
Meta and hyper keys don't register on `keyup` in any browser tested.
Expand Down
26 changes: 17 additions & 9 deletions jquery.hotkeys.js
Original file line number Diff line number Diff line change
Expand Up @@ -112,16 +112,18 @@
"\\": "|"
},

// excludes: button, checkbox, file, hidden, image, password, radio, reset, search, submit, url
/**
* Defines values of the &lt;input&gt; types for which shortcuts should NOT be active, unless
* bound directly. This setting is effective only if the 'filterTextInputs' flag is set to <tt>true</tt>.
* <p>
* Note that the following &lt;input&gt; types are, by default, valid targets for shortcuts,
* as they don't expect a textual (keyboard) form of input: button, checkbox, file, hidden, image, radio, reset, submit.
*/
textAcceptingInputTypes: [
"text", "password", "number", "email", "url", "range", "date", "month", "week", "time", "datetime",
"datetime-local", "search", "color", "tel"],

// default input types not to bind to unless bound directly
textInputTypes: /textarea|input|select/i,

options: {
filterInputAcceptingElements: true,
filterTextInputs: true,
filterContentEditable: true
}
Expand All @@ -145,11 +147,17 @@
handleObj.handler = function(event) {
// Don't fire in text-accepting inputs that we didn't directly bind to
if (this !== event.target &&
(jQuery.hotkeys.options.filterInputAcceptingElements &&
jQuery.hotkeys.textInputTypes.test(event.target.nodeName) ||
(jQuery.hotkeys.options.filterContentEditable && jQuery(event.target).attr('contenteditable')) ||
(
(jQuery.hotkeys.options.filterTextInputs &&
jQuery.inArray(event.target.type, jQuery.hotkeys.textAcceptingInputTypes) > -1))) {
(
/textarea|select/i.test(event.target.nodeName) ||
// check attribute 'type' - expected to be present on <input> elements
jQuery.inArray(event.target.type, jQuery.hotkeys.textAcceptingInputTypes) > -1
)
) ||
(jQuery.hotkeys.options.filterContentEditable && jQuery(event.target).attr('contenteditable'))
)
) {
return;
}

Expand Down