jQuery Virtual Keyboard Plugin - Keyboard

jQuery Virtual Keyboard Plugin - Keyboard
File Size: 1.29 MB
Views Total: 34804
Last Update:
Publish Date:
Official Website: Go to website
License: MIT

Keyboard is a jQuery plugin built with jQuery UI that adds an onscreen virtual Keyboard to your project , which will popup when a specified entry field is focused. It is mobile ready and also can be used as a Scientific Calculator.

You might also like:


$ npm install virtual-keyboard

# Bower
$ bower install virtual-keyboard

Basic Usage:

1. Include jQuery library and Keyboard in your head section

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script>
<script src="js/jquery.keyboard.js"></script>

2. Include jQuery UI and jQuery UI Theme

<link href="http://code.jquery.com/ui/1.9.0/themes/ui-darkness/jquery-ui.css" rel="stylesheet">
<script src="http://code.jquery.com/ui/1.9.0/jquery-ui.min.js"></script>

3. Include Keyboard CSS

<link href="css/keyboard.css" rel="stylesheet">

4. Include jquery.mousewheel.js (OPTIONAL)

<script src="js/jquery.mousewheel.js"></script>

5. Markup

<input id="keyboard" type="text">

6. Initialize Keyboard


6. Options and methods.

// set this to ISO 639-1 language code to override language set by the layout
// http://en.wikipedia.org/wiki/List_of_ISO_639-1_codes
// language defaults to 'en' if not found
language: null,
rtl: false,

// *** choose layout & positioning ***
layout: 'qwerty',
customLayout: null,

position: {
  // optional - null (attach to input/textarea) or a jQuery object (attach elsewhere)
  of: null,
  my: 'center top',
  at: 'center top',
  // used when 'usePreview' is false (centers the keyboard at the bottom of the input/textarea)
  at2: 'center bottom'

// allow jQuery position utility to reposition the keyboard on window resize
reposition: true,

// preview added above keyboard if true, original input/textarea used if false
usePreview: true,

// if true, the keyboard will always be visible
alwaysOpen: false,

// give the preview initial focus when the keyboard becomes visible
initialFocus: true,

// avoid changing the focus (hardware keyboard probably won't work)
noFocus: false,

// if true, keyboard will remain open even if the input loses focus, but closes on escape
// or when another keyboard opens.
stayOpen: false,

// if true, keyboard will not close if you press escape.
ignoreEsc: false,

css: {
  // input & preview
  input: 'ui-widget-content ui-corner-all',
  // keyboard container
  container: 'ui-widget-content ui-widget ui-corner-all ui-helper-clearfix',
  // keyboard container extra class (same as container, but separate)
  popup: '',
  // default state
  buttonDefault: 'ui-state-default ui-corner-all',
  // hovered button
  buttonHover: 'ui-state-hover',
  // Action keys (e.g. Accept, Cancel, Tab, etc); this replaces 'actionClass' option
  buttonAction: 'ui-state-active',
  // Active keys (e.g. shift down, meta keyset active, combo keys active)
  buttonActive: 'ui-state-active',
  // used when disabling the decimal button {dec} when a decimal exists in the input area
  buttonDisabled: 'ui-state-disabled',
  buttonEmpty: 'ui-keyboard-empty'

// *** Useability ***
// Auto-accept content when clicking outside the keyboard (popup will close)
autoAccept: false,
// Auto-accept content even if the user presses escape (only works if `autoAccept` is `true`)
autoAcceptOnEsc: false,

// Prevents direct input in the preview window when true
lockInput: false,

// Prevent keys not in the displayed keyboard from being typed in
restrictInput: false,
// Additional allowed characters while restrictInput is true
restrictInclude: '', // e.g. 'a b foo \ud83d\ude38'

// Check input against validate function, if valid the accept button gets a class name of
// 'ui-keyboard-valid-input'. If invalid, the accept button gets a class name of
// 'ui-keyboard-invalid-input'
acceptValid: false,
// Auto-accept when input is valid; requires `acceptValid` set `true` & validate callback
autoAcceptOnValid: false,

// if acceptValid is true & the validate function returns a false, this option will cancel
// a keyboard close only after the accept button is pressed
cancelClose: true,

// tab to go to next, shift-tab for previous (default behavior)
tabNavigation: false,

// enter for next input; shift+enter accepts content & goes to next
// shift + 'enterMod' + enter ('enterMod' is the alt as set below) will accept content and go
// to previous in a textarea
enterNavigation: false,
// mod key options: 'ctrlKey', 'shiftKey', 'altKey', 'metaKey' (MAC only)
enterMod: 'altKey', // alt-enter to go to previous; shift-alt-enter to accept & go to previous

// if true, the next button will stop on the last keyboard input/textarea; prev button stops at first
// if false, the next button will wrap to target the first input/textarea; prev will go to the last
stopAtEnd: true,

// Set this to append the keyboard after the input/textarea (appended to the input/textarea parent).
// This option works best when the input container doesn't have a set width & when the 'tabNavigation'
// option is true.
appendLocally: false,
// When appendLocally is false, the keyboard will be appended to this object
appendTo: 'body',

// If false, the shift key will remain active until the next key is (mouse) clicked on; if true it will
// stay active until pressed again
stickyShift: true,

// Prevent pasting content into the area
preventPaste: false,

// caret placed at the end of any text when keyboard becomes visible
caretToEnd: false,

// caret stays this many pixels from the edge of the input while scrolling left/right;
// use "c" or "center" to center the caret while scrolling
scrollAdjustment: 10,

// Set the max number of characters allowed in the input, setting it to false disables this option
maxLength: false,
// allow inserting characters @ caret when maxLength is set
maxInsert: true,

// Mouse repeat delay - when clicking/touching a virtual keyboard key, after this delay the key will
// start repeating
repeatDelay: 500,

// Mouse repeat rate - after the repeatDelay, this is the rate (characters per second) at which the
// key is repeated Added to simulate holding down a real keyboard key and having it repeat. I haven't
// calculated the upper limit of this rate, but it is limited to how fast the javascript can process
// the keys. And for me, in Firefox, it's around 20.
repeatRate: 20,

// resets the keyboard to the default keyset when visible
resetDefault: true,

// Event (namespaced) on the input to reveal the keyboard. To disable it, just set it to ''.
openOn: 'focus',

// Event (namepaced) for when the character is added to the input (clicking on the keyboard)
keyBinding: 'mousedown touchstart',

// enable/disable mousewheel functionality
// enabling still depends on the mousewheel plugin
useWheel: true,

// combos (emulate dead keys : http://en.wikipedia.org/wiki/Keyboard_layout#US-International)
// if user inputs `a the script converts it to à, ^o becomes ô, etc.
useCombos: true,

  // *** Methods ***
  // commenting these out to reduce the size of the minified version
  // Callbacks - attach a function to any of these callbacks as desired
  initialized   : function(e, keyboard, el) {},
  beforeVisible : function(e, keyboard, el) {},
  visible       : function(e, keyboard, el) {},
  change        : function(e, keyboard, el) {},
  beforeClose   : function(e, keyboard, el, accepted) {},
  accepted      : function(e, keyboard, el) {},
  canceled      : function(e, keyboard, el) {},
  restricted    : function(e, keyboard, el) {},
  hidden        : function(e, keyboard, el) {},
  // called instead of base.switchInput
  switchInput   : function(keyboard, goToNext, isAccepted) {},
  // used if you want to create a custom layout or modify the built-in keyboard
  create        : function(keyboard) { return keyboard.buildKeyboard(); },

  // build key callback
  buildKey : function( keyboard, data ) {
    / *
    data = {
    // READ ONLY
    isAction : [boolean] true if key is an action key
    name     : [string]  key class name suffix ( prefix = 'ui-keyboard-' );
                         may include decimal ascii value of character
    value    : [string]  text inserted (non-action keys)
    title    : [string]  title attribute of key
    action   : [string]  keyaction name
    html     : [string]  HTML of the key; it includes a <span> wrapping the text
    // use to modify key HTML
    $key     : [object]  jQuery selector of key which is already appended to keyboard
    * /
    return data;

// this callback is called, if the acceptValid is true, and just before the 'beforeClose' to check
// the value if the value is valid, return true and the keyboard will continue as it should
// (close if not always open, etc). If the value is not valid, return false and clear the keyboard
// value ( like this "keyboard.$preview.val('');" ), if desired. The validate function is called after
// each input, the 'isClosing' value will be false; when the accept button is clicked,
// 'isClosing' is true
validate: function (keyboard, value, isClosing) {
  return true;


v1.30.2 (2020-05-12)

  • Drop input type conversion from number to text.
  • Throw error on non-supported input types. 
  • Fix input type detection.
  • Fix destroyed keyboard detection.
  • Update sign regex based on decimal setting. 
  • Updated multiple layouts: Oriya, Tamil, Telugu, Malayalam, Hindi, Kannada, Bengali, Gujarati, Marathi, Nepali, Punjabi & Urdu.
  • Fix French translation. 

v1.30.1 (2019-06-25)

  • Fix focus when keyboard is set as current. 

v1.30.0 (2019-06-19)

  • The display option for action keys will now allow html (including colons), e.g. <span style="color:red">Panic!</span>.
  • Add Czech translation.

v1.29.1 (2019-05-04)

  • Update to work with jQuery v3.4+.
  • Remove focus binding on destroy.
  • Updated navigation, scramble & typing extensions to work with jQuery 3.4+.

v1.28.9 (2019-03-10)

  • Prevent overriding modified regex. Only if no language definition regex exists. 
  • Add base.isTextArea & base.isInput.
  • Add untranslated Czech language file.
  • Update layouts dist.

v1.28.8 (2019-02-20)

  • Replace substr with substring.
  • Ignore colons within HTML; allows adding a style attr to display HTML.
  • Add Syriac support. See issue #723; thanks @sixtyfive!
  • Remove extra {alt} in syriac-latin layout.
  • Prevent JS error when keyboard is closed.

v1.28.7 (2018-10-09)

  • Fix Usability (spelling error).
  • Fix comboRegex (spelling error).
  • Fix JS error.

v1.28.6 (2018-09-16)

  • Fix tab key insertion in textarea.
  • Prevent occasional focus error.
  • Update dependencies.

v1.28.5 (2018-07-29)

  • Add mousewheel throttle & key check. 
  • Include enter when restrictInput true.
  • Reduce rebinding focus delay.
  • Update dependencies.

v1.28.4 (2018-07-05)

  • Use crypto.getRandomValues for scramble.

v1.28.3 (2018-04-24)

  • Clear opening flag.
  • Update dependencies.

v1.28.2 (2018-04-20)

  • Allow urls in display option.
  • AltKeys: Switch to using event.key. 

v1.28.1 (2018-03-26)

  • Prevent double key action.
  • Use hasClass instead of indexOf. 

v1.28.0 (2018-02-24)

  • An activeOnReadonly option to open the keyboard.
  • Combine keyboard checks. 
  • Fix undefined variable.
  • Remove $allKeys variable; use delegated binding. 
  • Add checkValidOnInit option.
  • Disable keysets when popup is open.
  • Prevent exception with browser autocompletion. 
  • Update dependencies.
  • Update Authors.
  • Add rudimentary linting.

v1.27.4 (2018-01-11)

  • Core: Pass correct clicked target to close event.
  • Autocomplete: Add destroy method

v1.27.3 (2017-12-17)

  • Core: Prevent JS error while checking closeByClickEvent. 
  • Meta: Update dependencies.

v1.27.2 (2017-12-07)

  • Prevent JS error on empty contenteditable.
  • Fix contenteditable caret position at beginning of line.

v1.27.1 (2017-12-02)

  • Prevent bksp wrap to end.
  • Allow using {space} in restrictInclude option.

v1.27.2beta (2017-11-08)

  • Add missing wrapBR parameter.
  • Save caret after inserting a line break. Backspacing on this line break causes other issues that will be addressed later.

v1.27.2beta (2017-11-07)

  • Fix caret chaining.
  • Save caret position when positioned by dev. See issue #611.
  • Save current language to kb.language.
  • Add language and layout data-attribute to wrapper.
  • Fix toggle disabled state.
  • Fix contenteditable problems
  • CSS: Add white-space: pre; to keyboard css file for contenteditable elements.
  • Readme: Add link to Ember version.
  • Demo: Add undo and redo actions to Contenteditable layout.

v1.27.1beta (2017-10-03)

  • Fix contenteditable inside iframes.
  • Clean up caret right action function.
  • Preserve caret on sign change. 
  • Prevent caret function call on non form elements.
  • Prevent adding empty strings into acceptedKeys array. 
  • Remove extra filetypes from bower main entry. 

v1.27.0beta (2017-09-06)

  • Restore minimum jQuery to v1.4.3. 
  • Prevent max call stack size error.
  • Always return keyboard object.
  • Add contenteditable support
  • Fix getMaxIndex function & define kbcss only once.

v1.26.26 (2017-07-28)

  • Add rowLooping option. 
  • When last key in a row is selected, moving up and down now stays on the last key in the row. 

v1.26.25 (2017-07-09)

  • Clear timer3 timeout on keyboard destroy. 

v1.26.24 (2017-07-05)

  • Revert virtual enter navigation commit.

v1.26.23 (2017-06-03)

  • Remove keybindings from preview. 
  • Resolve issue: Raising keypress by functional keys is Firefox. 
  • Add Ethiopic layout and Amharic language. 
  • Update Ethiopic dist files.

v1.26.22 (2017-04-29)

  • AltKeysPopup: remove old highlight on hover.
  • Navigation: properly highlight key on reveal. 

v1.26.21 (2017-04-26)

  • AltKeysPopup: properly close popup when keyboard hides. 

v1.26.20 (2017-04-25)

  • keyboard will reposition on keyset change.
  • Restore keyup event. Fixes issue #552.
  • Fix active meta + shift/alt keys.
  • Restore keyup event.
  • Fix active meta + shift/alt keys.
  • Update dependencies.

v1.26.19 (2017-04-06)

  • Core: Prevent max call stack error. 
  • Autocomplete: Physical keyboard typing works again. Previously, only a mouse move would cause an update.

v1.26.18 (2017-03-16)

  • Prevent JS error if caret doesn't return a function.
  • Check event type before opening. 
  • Prevent JS error if keyaction closes the keyboard.
  • Prevent checkCombos error after keyboard closes.
  • Skip setTimeout when holdTime is zero.
  • Add randomizeInput option. 
  • Code cleanup.
  • Fix showTyping when false.
  • Allow setting delay to zero.
  • Add hoverDelay option.

v1.26.17 (2017-02-05)

  • Fix empty openOn
  • Autocomplete: Get value from preview or original input.

v1.26.16 (2017-02-03)

  • Autocomplete: Pass value to main element in usePreview.

v1.26.15 (2017-01-27)

  • Autocomplete: Save the correct selected value.
  • Autocomplete: Prevent stackoverflow of triggered events.

v1.26.14 (2017-01-25)

  • Ensure autoaccept saves last value. 
  • Save selected value to last variable.

v1.26.13 (2017-01-14)

  • Add kb.last.keyPress value.
  • Fix noFocus being ignored.
  • Resolve initial focus issue.
  • Allow reinitialize & add popupPosition callback. 

v1.26.12 (2017-01-11)

  • enterNavigation include virtual shift to switch input.
  • Fix click to switch input in IE11. 
  • Fix function bypass before keyboard visible.

v1.26.10 (2017-01-09)

  • Add Burmese language & layout files.
  • Update Burmese files.

v1.26.9 (2017-01-08)

  • Chained functions stop when keyboard is hidden.
  • Add getKeySet method. 

v1.26.8 (2017-01-06)

  • Meta keyset names no longer require a number. 
  • Update to allow the following functions to be chained: checkMaxLength, insertText, redraw, showKeySet and toggle.
  • The redraw function now accepts a layout parameter.
  • Add caret function.
  • Update to handle keyset changes with the new meta keyset names.

v1.26.7 (2016-12-24)

  • Core: prevent form submission on hidden input.

v1.26.6 (2016-11-29)

  • Move caret call before blur prevents jumping.
  • Prevent default only on locked input.
  • Minor linting update.
  • Include select elements in tab navigation.
  • Two different custom layouts now working. 

v1.26.5 (2016-10-01)

  • Revert addition of preventDefault.
  • Fix {empty} keys inserting a colon.
  • AltKeysPopup: Do not unbind all events after init. 
  • CSS Update.

v1.26.4 (2016-09-15)

  • bugfixing Core: Empty buttons do not get the action class.
  • Autocomplete: Fix issues with custom widget calling.

v1.26.3 (2016-09-01)

  • Autocomplete: Allow for custom widgets
  • Autocomplete: Custom widgets have custom events.

v1.26.2 (2016-08-20)

  • Internally bind to inputRestrict event for callback.
  • Merge & tweak closeByClickEvent bug fix. 

v1.26.1 (2016-08-13)

  • Add new setting closeByClickEvent. 
  • Core: Include userClosed default.

v1.25.29 (2016-07-30)

  • Add autoAcceptOnValid with virtual typing.
  • Prevent JS error when usePreview is false.
  • Add beforeInsert callback method.
  • Add event.preventDefault after focusing on input. 

v1.25.28 (2016-05-30)

  • Prevent JS error if keyboard closes before "keyup".
  • Add autoAcceptOnValid option.

v1.25.28 (2016-05-24)

  • Readme: Add link to gemfile. 
  • Docs: Update jQuery & add migrate for v3.0.
  • Core: Only trigger named events.

v1.25.27 (2016-04-27)

  • Added Italian translation.

v1.25.26 (2016-04-07)

  • Set position fixed on test element to prevent scrolling.
  • Click/touchstart correctly switches to alwaysOpen keyboards. 
  • Correct stickyShift behavior. 
  • Update dependencies.

v1.25.25 (2016-03-08)

  • Extender: Do not remove extender toggle button!

v1.25.24 (2016-03-06)

  • Update dependencies.
  • Remove keyboard data from preview when usePrevies is true.

v1.25.23 (2016-02-27)

  • HTML is now allowed in display settings.

v1.25.22 (2016-02-21)

  • Retain input value on alwaysOpen hover; 
  • Add redraw method.
  • Extracted from reveal method, so using reveal(true) no longer works as expected.

v1.25.21 (2016-02-21)

  • Caret: Adjust calculation when textAlign:center set

v1.25.20 (2016-02-19)

  • Files are now available through CDNJS!
  • Fix theme switcher styling.
  • Fix reference to destroyed base.
  • Update dependencies.

v1.25.18 (2016-02-07)

  • Update dependencies & distribution files.

v1.25.17 (2016-02-07)

  • Prevent repeater event if key is disabled. 
  • Use different namespace for callbacks.

v1.25.16 (2016-02-02)

  • Add userClosed option. 
  • Add remove keyboard function & prevent memory leaks.
  • Reformat code.
  • Scramble: Scramble once with multiple always open keyboards. 

v1.25.14 (2016-01-20)

  • Fix action key class names - bug introduced in last update.
  • Triggered change events now use a modified keyboard event.
  • The lock (caps lock) key now "sticks" properly.
  • Call validate with empty input..

v1.25.13 (2016-01-17)

  • Update jQuery & migrate plugin.
  • Add jQuery v3.0.0-beta1 to test.
  • Fix ":" mapping & change key data-action values.
  • Dash & underscore keys get a class name assigned.
  • Include arrow & other keys.
  • Fix issue where "." was not highlighted while typing.

v1.25.12 (2016-01-10)

  • Tweak capslock detection code.
  • restrictInput matches accepted keys instead of replacing.
  • Fixed mapped & accepted keys.
  • Add last.preVal which stores the previous value.
  • Fix javascript error.
  • Prevent javascript error if altKey is undefined.
  • Tweak capslock detection code.
  • Prevent opening multiple popups.
  • Fix key highlighting on keyboard navigation.
  • Ensure all popup windows removed.
  • Typing: Fix mapped key highlighting while typing.
  • Build: Include unminified keyboard file in dist folder. 

v1.25.10 (2015-12-11)

  • Use correct event names while binding callback options.
  • Make internal close function public.
  • Compare altkeys to key data-value. 
  • Add physical keyboard long hold & popup navigation. 

v1.25.10 (2015-12-05)

  • Add missing definitions to custom themes.
  • Add minified custom themes.
  • Keep keyboard centered while resizing textarea.
  • Prevent beforeVisible & visible events when alwaysOpen is true.
  • Save caret immediately before changing focus.
  • Keyboard now works with readonly set on input prior to initialization.
  • Move duplicate touchstart code to prevent lag on Mobile devices. Fixes issues #379 & #411.
  • Consolidate keyCodes to make the code more readable.
  • Extensions: update extensions to prevent duplicates. In case alwaysOpen is true & beforeVisible or visible events fire.

v1.25.9 (2015-11-26)

  • Themes: Update custom basic (white) & add dark theme.
  • Update state of combo & accept keys in their title.
  • Added display options for valid, invalid, active and disabled to allow language specific changes.
  • Make keysets display inline-block; remove all css floats.
  • Update default display value before initialization.
  • Make extender layout display inline-block.
  • Docs: update Bootstrap to v3.3.6.
  • Grunt: Fix uglify to only preserve comments that start with a bang.

v1.25.8 (2015-11-21)

  • Add endrow break after spaces. 
  • Remove extraneous preview data-attributes. 
  • Update dependencies.
  • Add rudimentary unit testing.

v1.25.6 (2015-11-16)

  • alwaysOpen changes
  • Do not redefine stored preview object when alwaysOpen.
  • alwaysOpen keyboards are now activated without using focus. 
  • Restricted input compare to string. Fixes issue #399.
  • Add restrictInclude option & update hex demo.
  • Do not include space with enter unless using old IE.
  • Mousewheel tweak
  • Clear clone variable on keyboard close.
  • openOn option now allows multiple events.

v1.25.6 (2015-09-24)

  • Caret: Fix caret when currently focused keyboard is refocused with no preview window.

v1.25.5 (2015-09-14)

  • resetDefault option now behaves properly; set default to true. 
  • Active meta keys get a css.buttonActive class name, again
  • Typing: Update for modified data-action from v1.24.0. 

v1.25.3 (2015-08-20)

  • Use jQuery position() method instead of DOM offset. 
  • Prevent javascript error while using physical keyboard tab. 

v1.25.2 (2015-08-19)

  • Include null when using getComputedStyle to prevent errors in older browsers. 

v1.25.1 (2015-08-18)

  • Add keyboard data to the preview input & keyboard, so using any of these methods will return the keyboard object
  • Autocomplete: correctly position autocomplete popup on subsequent keyboard openings.

v1.25.0 (2015-08-13)

  • Don't stop repeating when touch moves within the same key.
  • Add noFocus option to avoid focusing the input; use with caution for old IE!
  • Ensure lockInput is effective when toggling.
  • Add ignoreEsc option to prevent escape from closing the keyboard.
  • Some more tweaks to the above code.
  • Add popup css option (in addition to container css option; they both add to the same element) to allow for adding theme class names more easily.
  • Adjust css to include "ui-keyboard-dark-theme" to use brighter icons.
  • Fix a bug to prevent it from showing up in the space bar.
  • Ensure caret is properly initialised and visible for an alwaysOpen keyboard.
  • Make caret visible immediately on reveal, not just when another event occurs.
  • Add a basic white, non-library (not jQuery UI or Bootstrap) theme
  • This theme is to be used when neither jQuery UI css nor position utility is used as it positions the keyboard at the bottom of the browser windows using css.

v1.24.1 (2015-08-06)

  • Avoid javascript errors when caret extension used without a preview window.
  • Caret is now removed when keyboard is hidden (when userPreview is false).

v1.23.6 (2015-08-03)

  • Clear key now enables {dec} key. 
  • Add processName function
  • The data-name attribute replaces the name attribute on buttons
  • The lockInput option now blocks backspace, enter, capslock and pasting from the physical keyboard.
  • Mapped keys
  • Add buildKey callback function: it allows the modification of the text of the virtual key, like add line breaks or modify the HTML.
  • Add useWheel option
  • Add callback function to the destroy function
  • Add zero-width keys & non-breaking space as action keys
  • Update typing extension to use meta keys properly; since the name attribute is no longer used.
  • Languages: Add native & English name to language value.
  • Use $.keyboard.caret(#) where # sets the start & end of the caret (no text is selected).
  • Use $.keyboard.caret('start') or $.keyboard.caret(0) to move the caret to the beginning.
  • Use $.keyboard.caret('end') (or, really any string that isn't 'start') to move the caret to the end.

v1.23.5 (2015-07-09)

  • Autocomplete: add autocomplete menu position options.
  • Language: add Spanish translations

v1.23.4 (2015-07-08)

  • Destroy method removes extension bindings.

v1.23.3 (2015-07-07)

  • Fix javascript error when no options set.

v1.23.2 (2015-07-07)

  • Stop document events from opening the keyboard. 
  • Fix create callback function; mobile 1.4 demo works again.
  • Simplified the use of keyboard.showKeySet() method (ref).
  • Extend position options separately.
  • Language: add German language file. Thanks C. Pape!
  • Autocomplete: minor cleanup.
  • Caret: Add new caret extension (beta) which adds a stylable caret to the keyboard.
  • Navigation: fix caret positioning keys.

v1.23.1 (2015-06-23)

  • Prevent js error if destroyed in "hidden" callback. 
  • Stop focusOn execution while typing on physical keyboard.
  • Navigation extension: navigateTo now accepts [0,0] properly. ui-state-hover" class now applied when switching key sets.

v1.23.0 (2015-06-07)

  • Fix caps lock detection.
  • Fix hidden input overflow on page.
  • Fix caret jumping to end while inserting text.
  • Update XHTML compatibility.
  • Add russian language translations. 
  • Removed language definitions from layout files.
  • Add languages folder with files named using the ISO 639 language code. See issue #355.
  • Existing language definitions without a translation were moved to files with "untranslated" in the file name, e.g. "mn.untranslated.js".

v1.22.6 (2015-06-03)

  • Fixed grunt build issues. 
  • Fixed missing tag terminator. Now XHTML compatible. 
  • Backspace now properly removes all characters. 

v1.22.5 (2015-04-27)

  • Include code inside of keyboard AMD wrapper.
  • Remove need for document ready to check for caret support.
  • Fixed AMD Loading with require.js

v1.22.4 (2015-04-19)

  • Core: move build row code into a separate function (so the new extension can use it).
  • AltKeyPopup extension: show alternate keys popup after clicking/pressing and holding on set keys. 

v1.22.3 (2015-04-10)

  • Bug fix undefined error, if destroy is called before times have fired. 
  • Destroy method now clears timers.
  • Caret position on open & caretToEnd working. 
  • Disabled button now maintain default appearance (rounded corners were disappearing).

v1.22.2 (2015-03-30)

  • Add setScroll function to accurately set the scroll position so the caret is visible. 
  • Add element id to keyboard + $.keyboard.css.idSuffix to allow specific keyboard styling with css.
  • Extender: Wrap with UMD code.
  • Preview Keyset: Now works when alwaysOpen is true.
  • Scramble: Fix javascript error preventing keyboard from appearing ( broken in v1.21.2 :/ ).
  • Typing: Trigger "keyboardChange" event while simulating typing.
  • Misc: Remove byte-order mark from package.json. 

v1.22.1 (2015-03-14)

  • Destroy method now removes all references. 
  • Close function is now called when stayOpen is true and clicking to open another keyboard.
  • Update password demo to close on second click. 
  • Update to use jQuery v1.11.4.
  • Stop typing simulation on user interaction.
  • Add new and additional typeIn support for simulated keys: caret left = {l}, caret right = {r}, delete = {d} (\\d removed), tab = \t or {t}, backspace = \b or {b}, enter = \n or \r or {e}
  • Find virtual key using data-action attribute as it's value doesn't change with other languages.
  • Use keyaction functions instead of just inserting the text.

v1.22.0 (2015-03-08)

  • Add AMD/browserify support.
  • Add {del} key & modify {bksp} key.
    • The delete key allows deleting content to the right of the caret.
    • The backspace key still allows deleting content to the left of the caret, it's code was only tweaked internally to not use plain text to indicate a backspace.
  • Add {normal} key & deprecate {default} key:
    • The {normal} key is a duplicate of the {default} key.
    • Since "default" is a reserved javascript word, this key is being deprecated to prevent future issues.
  • last variable changes:
    • Rename last.value to last.val - it was inconsistent internally. This contains the current preview input value.
    • Add last.event - contains last DOM event object; saved by keypress, repeater and events set by the keyBinding option.
    • Add last.$key - jQuery object of the last virtual key used; it is set to an empty array when the physical keyboard is used.
    • Add last.layout - contains the name of the layout last used by the keyboard.
    • Update last.eventTime upon closing the keyboard.
  • Remove internal keyboard position setting
    • Absolute positioning is already defined in the css
    • The inline setting was interfering with alternative positioning.
  • Caret
    • Started centralizing caret positioning code.
    • Anticipating the possibility of swapping out caret positioning plugins, or using an input mask plugin.
    • A suitable alternatives has yet to be found; either way, more code adjustment will be necessary to make this work.
    • Set caret position to end when caret positioning isn't supported; it was previously returning a full selection.
  • Grunt build
    • Add a "grunt layout" build to build everything.
    • The default "grunt" build now ignores layout files as uglifying & concatenating layout files takes more time.

v1.21.3 (2015-03-05)

  • Add Extender extension. It allows toggling an extra layout (e.g. numpad) next to the keysets. Any layout can be used, but only the "normal" (previously "default") keyset will be visible.
  • Add 93 more layouts.

v1.21.2 (2015-03-03)

  • Toggle action key icon css tweaks
  • Add save caret position function - used to save caret position, especially after the visible event. 
  • General code cleanup.
  • Added to allow toggling an extra layout.
  • The main example allows toggling of a 'numpad' (new layout with extension).
  • Any layout can be used, but only the "normal" keyset will be added.

v1.21.1 (2015-03-01)

  • Add toggle action key
    • Allows enabling or disabling all keyboard keys & preview input.
    • Button uses base64 encoded svgs for its icon (included in the css/images directory).
  • Autocomplete: Fix event error & caret repositioning issue.

v1.21.0 (2015-02-22)

  • Removed namespacing requirements from all event bindings 
    • When binding to events, the .keyboard is no longer a requirement namespace as keyboard events are now contained with the $.keyboard.events variable.
    • See the updated Methods wiki page for more details.
  • Moved various checks outside of instanced keyboards. This includes:
    • Check for older version of IE.
    • Watermark support.
    • Caret positioning being saved when input is hidden or loses focus.
  • Add autoAcceptOnEsc option:
    • Setting this to true will only work if the autoAccept option is true.
    • Allows forcing the content to be accepted even if the user presses escape.
    • Fixes issue.
  • Changed language option:
    • It can now be set as either a string ("en") or an array (["en"]).
    • As an array, it will allow for future expansion so that a multiple languages can be set for one layout.
  • Changed position option:
    • It can now be set as false or even an empty string.
    • Previously, to avoid using the jQuery UI position utility this option was supposed to be set to an empty object ({}); but internal scripting was continuing to update and use this option to activate the jQuery UI position utility. No more!
  • Fixed an issue with meta keys getting broken by the v1.20.0 update. Sorry!

v1.19.3 (2015-01-04)

  • Add build process.
  • Rename "all.js" to "keyboard-layouts-greywyvern.js"
  • Combine all other layouts into a "keyboard-layouts-combined.js" file.
  • Combine all extensions into "jquery.keyboard.extension-all.js" file.
  • Create a minimized version of all files (css & js) in a 'dist' folder.
  • Removed all .min.js files from the js folder; this might break some external demos.
  • Add "keysetChange" event; fired when the visible keyset changes.
  • Moved internal class names to $.keyboard.css.
  • Moved internal event names to $.keyboard.events.
  • Perform max length check before validating.
  • Fix mobile css styles.
  • Fix issues with mobile theming.
  • Fixed broken extension code.
  • Add navigation functions that work in untoggle mode.
  • Add new preview keyset extension.
  • Choose which keysets to preview & use pure css to display it.

v1.19.3 (2015-01-04)

  • Core: correct problem with typed characters (introduced in 1.19.2). 
  • Typing extension: Fix issue with callback being called repeatedly.

v1.19.2 (2014-12-27)

  • Update keyboard languages before building.
  • Reset active keysets when switching layouts.
  • Restore contents of preview when swapping layouts.
  • Fix clicking on mousewheel altered keys; empty keys are now ignored.
  • Fix mislabeled languages.
  • Make corrections to Hindi layout. 
  • Add Persian (Farsi) layout.
  • Add layouts generated & modified from the greywyvern virtual keyboard.

v1.19.1 (2014-11-21)

  • Num layout now uses {dec} instead of a decimal point.
  • Save original settings, so scramble extension works properly.

v1.19.0 (2014-11-20)

  • Check for jQuery UI before checking for the position utility. 
  • Add maxInsert option; when true it allows inserting characters at the caret when the max length is set. 
  • Fix tab navigation when openOn option is empty. 
  • Allow inline renaming of action keys; it works the same as the other non-action keys
  • Remove mousewheel scrolling through keyset text for action keys
  • Build will now ignore layout keys name, lang and rtl.
  • Add restricted callback function.
  • Add reposition option to automatically reposition the keyboard on window resize.
  • Modified reposition option to ignore repositioning when the keyboard is not attached to the page 'body'. 
  • The change callback no longer keeps the last keyboard open. 
  • Ensure preview variable is updated & keyboard is positioned properly when usePreview is false.
  • Switching inputs (tab/enter navigation) now ignores disabled elements.
  • Page no longer scrolls in Firefox upon initialization. 
  • Fix initial positioning when usePreview is false.
  • Fix js error when using email/number inputs.
  • Caret detect selectionStart in Firefox using alternate method.
  • Caret position can again be set to zero. 
  • Fix Colemak demo; contenteditable not yet supported.
  • Changed International demo to use a Bootstrap theme.
  • Changed syntax highlighting script to prettify.
  • Updated all layouts to include an internal language definition.
  • The language used in virtual keyboard keys now automatically switches to the layout set language; this can be overridden by the core language setting.
  • Updated Russian layout. 
  • Add Serbian layout. 
  • Add an example template file (_template.js) for use as a starting template to add more language layouts.
  • Autocomplete extension: now works with jQuery v2.1+. 
  • Typing extension: add lockTypeIn option & fix javascript error while user types.
  • Scramble extension: Keyboard no longer disappears when scramble initializes more than once. 

v1.18.12 (2014-07-19)

  • Added an internal version number. Access it as follows: $('#keyboard').data('keyboard').version
  • Updated mousewheel plugin & made code backwards compatible.
  • Added byKeySet to scramble extension to allow scrambling of just one keyset, then making all other keysets match it. 

v1.18.11 (2014-07-16)

  • Scramble extension no longer breaks layout when initialized twice. 

v1.18.10 (2014-07-09)

  • Add Romanian keyboard layout. Thanks to aflorea for all the work! 
  • Number type inputs do not support caret positioning, so the preview input (only) will now switch to a text type input.
  • Removed "aria-haspopup" from the preview clone.
  • Update hash code; removed slower reduce method.

v1.18.9 (2014-06-02)

  • Change keyboard collison fallback to "flipfit flipfit".
  • Caret: prevent errors when input doesn't support caret positioning.
  • Fix js error when base.$keyboard is removed.
  • Scramble: now applied when keyboard is alwaysOpen. Fixes issue #276.
  • Ignore position utility if position option is empty.
  • Set preview value before triggering accept event.
  • Update Mobile extension & demos.

v1.18.8 (2014-05-17)

  • Fix position option

v1.18.7 (2014-05-11)

  • Fixed switchInput to ignore validation.
  • Keyboard event namespacing fixes
  • Action key display option can now include HTML.
  • The changes to the default appendLocally & appendTo options now assumes that the developer desires a static keyboard position.

v1.18.6 (2014-03-28)

  • Fix Colemak demo; contenteditable not yet supported.
  • Check for jQuery UI before checking for position utility. 
  • Colon key now works without mousewheel script. 

v1.18.5 (2014-03-21)

  • Add Colemak keyboard to the build-in layouts.
  • Add appendTo option.
  • Backspace action key function $.keyboard.keyaction.bksp is now correctly called. 
  • Add Chinese, Mongolian & Hindi layouts. 

v1.18.4 (2014-03-07)

  • Empty buttons class names are once again set as ui-keyboard-empty, instead of ui-keyboard-. 
  • Empty buttons can now include a width setting.
  • Destroy method works before keyboard is revealed. 

v1.18.2 (2014-03-02)

  • Add type attribute to virtual keyboard buttons
  • Scramble extension no longer ignores spacers. Fixes issue #240
  • Fix initial focus - when a preview input is used, the focus is again transferred to it upon keyboard opening.
  • Fix remember caret position in preview input after reveal (except in IE; not sure why)
  • Caret plugin now accepts an object
  • Updated all extensions to work with v1.18+

v1.18.1 (2014-02-19)

  • Custom layouts now stored using a unique hash
  • version bump & mobile link fixes

v1.18.0 (2014-02-18)

  • version update.

v1.17.19 (2014-01-04)

  • Add minified extensions.

v1.17.17 (2013-11-24)

  • Add scramble extension & demo
  • fixed physical Tab doesn't work

v1.17.13 (2013-11-17)

  • add Tamil99-modified keyboard for use with Unicode encoding

v1.17.11 (2013-10-08)

  • Caret now positions properly. 

v1.17.7 (2013-05-14)

  • Fixed the autocomplete extension to not close the keyboard when clicking within the autocomplete window, including the scroll bar.
  • Fixed an issue in IE8 where a javascript error would occur in textarea when usePreview is false.

v1.17.6 (2013-05-11)

  • Fixed the check combo function to not cause an error when the keyboard is hidden.

v1.17.5 (2013-05-06)

  • Keyboard visible callback now triggered after the preview gets focus. Fixes issue #147.

v1.17.4 (2013-04-15)

  • AIE now gets focus on opening

v1.17.2 (2013-03-30)

  • After the content is accepted or canceled, a non-namespaced change event will now be triggered.
  • Added French Bépo keyboard layout.
  • Added Vietnamese layout with Telex combinations.
  • Added initialFocus option:
    • When true (default), the preview input will be focused when the keyboard becomes visible.
    • If false, no focus will be set.


This awesome jQuery plugin is developed by Mottie. For more Advanced Usages, please check the demo page or visit the official website.