CODEWITHSUNDEEP
jquerytextarea
meow
meow

Reputation: 28164

Disallowing keystrokes in the textarea with jQuery

In the Twitter signup process, they do not allow you to input any character other than alphanumeric keywords

What would be a good way, efficient way of doing so? The plugins available seems to be a little too slow for my liking, so i was wondering if anyone had more efficient way of doing so

Upvotes: 0

Views: 138

Answers (3)

Robert
Robert

Reputation: 21388

You can listen for keydown/keypress, check the character code, and if it's not something you want preventDefault() or return false

Implementation

Here's an example with jQuery. This creates a list of 'valid' keycodes, initially populated with formatters (Escape, Backspace etc) and then populates the array with other valid keys.

$('input').keydown(function(e) {
    var a=[8,9,13,16,17,18,20,27,35,36,37,38,39,40,45,46,91,92];
    var k = e.which;

    for (i = 48; i < 58; i++) // 0-9 on top of keyboard
        a.push(i);
    for (i = 65; i < 91; i++) // a-z
        a.push(i);
    for (i = 96; i < 106; i++) // 0-9 on numpad
        a.push(i);

    if (!(a.indexOf(k)>=0)) // prevents disabled keys
        e.preventDefault();
});​

You can also use this array to check validity of the username before submitting, by iterating through each character in the string and making sure it's one of these.

Try it out here

http://jsfiddle.net/vRJ2v/

Upvotes: 3

RememberME
RememberME

Reputation: 2092

I use this plugin: http://code.google.com/p/jquery-keyfilter/

I haven't had any issues with delay.

Upvotes: 2

Jacob Relkin
Jacob Relkin

Reputation: 163228

You can write an event handler for the keydown event which stops the propagation of the event if the text does not match a regular expression for example.

Upvotes: 1

Related Questions