Question

I’d like to know how to do the following with Jquery:

I have 1 textfield in a form.
Whenever the first character is a number, change the attr name of this field to ‘number’. If the first character is a letter, change this attr name to ‘letter’.

!! This also has to work when a number or text is copy-pasted into the field.

Thanks!
Jeroen

Answer 1

Bind (some) event(s) to the text field: The keyup event is used to update the name attribute when the user modifies the text (including shortcut CTRL+V copy-pasting),
the paste and mousemove events are used to deal with copy-pasting (dragging, contextmenu).

$("#your-input").bind("keyup paste mousemove", function() {
    var char = this.value.charAt(0);     // Use vanilla JavaScript to get the
                                         // first character of the text field
    if (/[0-9]/.test(char)) {            // Test against a pattern: digit
        $(this).attr("name ", "number");
    } else if (/[a-zA-Z]/.test(char)) {  // Else, pattern: letters
        $(this).attr("name", "letter");
    } else {                             // Finally, no name?
        $(this).attr("name", "");
    }
});

Remove else {...}, and replace else if(/[a-zA-Z]/.test(char)) { with else { if you want the default name to be letter.