Insert Special Characters in Textbox using jQuery

The plugin “Special Input” creates a responsive keyboard based on jQuery and CSS to insert special characters in textbox (input / textarea). It appends a virtual keyboard with text input, where users can select characters to insert. The plugin comes with both lowercase and uppercase french characters. It allows you to change language and you can also define new characters in plugin configuration.

Furthermore, the keyboard layout and buttons styles can be fully customize with additional CSS according to your needs.

Plugin Overview

Plugin: specialinput
Author: Gymglish
Licence: MIT Licence
Published: September 25, 2019
Repository: Fork on GitHub
Dependencies: jQuery 1.7.2 or Latest version
File Type: zip archive (HTML, CSS & JavaScript )
Package Size: 10.7 KB

How to Use Plugin to Insert Special characters in Textbox

1. First of all download this project, load jQuery JavaScript library and Special Input‘s CSS and JavaScript file into your web page.

<!-- jQuery -->
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>

<!-- Special Input CSS -->
<link href="css/jquery.specialinput.css" rel="stylesheet" />

<!-- Specail Input JS -->
<script src="js/jquery.specialinput.js"></script>

2. After loading all necessary assets, create an input (or textarea / textbox) element with a unique id in which you want to insert special characters.

<input id="text-input" type="text" />

3. Now, its time to active special characters keyboard. So, initialize the plugin in jQuery document ready function to active keyboard to insert special characters in textbox.

$(document).ready(function(){

   $("#text-input").specialinput();

});