jQuery On-Screen Keyboard

This is a simple on-screen keyboard powered by JavaScript/jQuery. I have made some enhancements to the jsKeyboard plugin and fixed some bugs it had and added it to GitHub. Download

* Updated default keyboard layout
* Hooked up to work with mutiple field inputs
* Added cursor to show when typing
* Fixed bug: types character on cursor position instead of appending
* Fixed bug: deletes on character position instead of last character
* Fixed bug: space actually adds a space
* Added HTML5 validation rules

Frequently Asked Questions (FAQs) about jQuery On-Screen Keyboard

How do I install the jQuery On-Screen Keyboard on my website?

To install the jQuery On-Screen Keyboard on your website, you first need to include the jQuery library in your HTML file. After that, download the jQuery On-Screen Keyboard plugin and include the JavaScript and CSS files in your HTML file. Then, you can initialize the keyboard by selecting an input field and calling the keyboard() function on it. This will automatically attach the on-screen keyboard to the selected input field.

Can I customize the layout of the jQuery On-Screen Keyboard?

Yes, the jQuery On-Screen Keyboard is highly customizable. You can change the layout of the keyboard by passing a layout option when initializing the keyboard. The layout option should be an object that defines the layout for each state of the keyboard. You can also customize the appearance of the keyboard by modifying the CSS file.

How do I use the jQuery On-Screen Keyboard with a touchscreen device?

The jQuery On-Screen Keyboard works seamlessly with touchscreen devices. When an input field that has the keyboard attached is tapped, the keyboard will automatically appear on the screen. The user can then type by tapping the keys on the keyboard. The keyboard will automatically disappear when the input field loses focus.

Can I use the jQuery On-Screen Keyboard with multiple input fields?

Yes, you can use the jQuery On-Screen Keyboard with multiple input fields. You just need to select all the input fields and call the keyboard() function on them. This will attach the keyboard to all the selected input fields. When any of the input fields is focused, the keyboard will appear.

How do I handle special keys like Enter and Tab with the jQuery On-Screen Keyboard?

The jQuery On-Screen Keyboard supports special keys like Enter and Tab. You can define the behavior of these keys by passing a keyAction option when initializing the keyboard. The keyAction option should be an object that maps key names to functions. When a key is pressed, the corresponding function will be called.

Can I use the jQuery On-Screen Keyboard with a form?

Yes, you can use the jQuery On-Screen Keyboard with a form. When the form is submitted, the values entered using the keyboard will be included in the form data. You can also validate the input using the keyboard’s built-in validation features.

How do I disable the jQuery On-Screen Keyboard?

You can disable the jQuery On-Screen Keyboard by calling the keyboard’s destroy() method. This will remove the keyboard from the input field and restore the original input behavior.

Can I use the jQuery On-Screen Keyboard with other jQuery plugins?

Yes, the jQuery On-Screen Keyboard can be used with other jQuery plugins. It is designed to work seamlessly with the jQuery ecosystem. However, you should ensure that there are no conflicts between the keyboard and other plugins.

How do I update the jQuery On-Screen Keyboard?

To update the jQuery On-Screen Keyboard, you need to download the latest version of the plugin and replace the old JavaScript and CSS files with the new ones. You should also check the plugin’s documentation for any changes in the API.

Can I use the jQuery On-Screen Keyboard in a commercial project?

Yes, the jQuery On-Screen Keyboard is licensed under the MIT License, which allows you to use it in both commercial and non-commercial projects. However, you should include the copyright notice and the license in any copies of the software.