Beim jQuery Keypad handelt es sich um ein Plugin mit welchem es möglich ist sicherere Eingaben mittels eines “keyboard ähnlichen Bedienfelds” zu machen. Das Plugin fügt einem Textfeld oder einem anderen Maus-gesteuerten Eintrag ein PopUp an.
Die Werte welche im Bedienfeld angezeigt werden sollen können einfach gesetzt werden, was es ermöglicht nur Nummern, ausländische Buschstaben usw. anzuzeigen.

Das Keypad kommt mit einer Vielzahl an Einstellmöglichkeiten. So ist z.B. das einblenden mittels “fade in” oder “slide down” möglich. Es gibt aber auch noch eine Menge andere Einstellungen wie z.B.:

• isRTL: Der Text wird vonrechts nach links dargestellt.
• clearText: entfernt alle Inhalte aus dem Textfeld.
• keypadClass:  Die CSS-Klasse mit welcher man einfach das aussehen des Keypads anpassen kann.
• uvm..

Ein einfaches Beispiel

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

$('#defaultKeypad').keypad();
 
$('#viewKeypad').click(function() {
    alert('The current value is: ' + $('#defaultKeypad').val());
});
 
$('#removeKeypad').toggle(function() {
        $(this).text('Re-attach');
        $('#defaultKeypad').keypad('destroy');
    },
    function() {
        $(this).text('Remove');
        $('#defaultKeypad').keypad();
    }
);

Alle weiteren Informationen, sowie Demos und die Dateien zum Download findet man auf der offiziellen Website, in der Dokumentation oder auf der Projekt-Seite bei jQuery direkt.

Ähnliche Artikel

• 1. Dezember 2010 -- jQuery Mobile – Der Seitenaufbau
• 25. November 2010 -- jQuery Mobile – Web-Apps mit jQuery
• 19. November 2010 -- Praxistipp: Suchfeld leeren on focus (jQuery)