jquery - How to prevent non-alphanumeric input in javascript? - Stack Overflow

admin管理员组

文章数量:1187337

$("#user").keyup(function(e){ 
    var regx = /^[A-Za-z0-9]+$/;
    if (!regx.test('#user')) 
    {$("#infoUser").html("Alphanumeric only allowed !");}
);}

#user is a text input, and I want to diplay a warning if user enters anything except letters and numbers.
In the above case, the warning is present whatever is typed.

$("#user").keyup(function(e){ 
    var regx = /^[A-Za-z0-9]+$/;
    if (!regx.test('#user')) 
    {$("#infoUser").html("Alphanumeric only allowed !");}
);}

#user is a text input, and I want to diplay a warning if user enters anything except letters and numbers.
In the above case, the warning is present whatever is typed.

• javascript
• jquery
• regex

Share Improve this question Follow edited Jan 15, 2013 at 11:20 rai.skumar 10.7k66 gold badges4242 silver badges5555 bronze badges asked Jan 15, 2013 at 10:55 AlegroAlegro 7,9561818 gold badges5454 silver badges7878 bronze badges 4

• with e.g. texotela.co.uk/code/jquery/numeric – algorhythm Commented Jan 15, 2013 at 10:56
• 2 You're testing your regex on the string #user itself, not of the content/value of the element that have the id user. !regx.test($(e).val()) should suit your needs. – sp00m Commented Jan 15, 2013 at 10:57
• Not an answer, but just a reminder: Don't depend on this if you're submitting values into a database. Javascript can easily be disabled. – andy Commented Jan 15, 2013 at 11:01
• @andy, thanks. I have similar check on php side. I just want to diplay this warning before submitting. – Alegro Commented Jan 15, 2013 at 11:05

Add a comment  | 

5 Answers 5

Sorted by: Reset to default 14

change:

if (!regx.test('#user')) 

to

if (!regx.test( $(this).val() ) ) 

Do:

$("#user").keyup(function(e){     
    var str = $.trim( $(this).val() );
    if( str != "" ) {
      var regx = /^[A-Za-z0-9]+$/;
      if (!regx.test(str)) {
        $("#infoUser").html("Alphanumeric only allowed !");
      }
    }
    else {
       //empty value -- do something here
    }
});

JS Fiddle example

You must test with #user element value not '#user' string

$("#user").keyup(function(e){ 
    var regx = /^[A-Za-z0-9]+$/;
    if (!regx.test($('#user').val()))  // .
    {$("#infoUser").html("Alphanumeric only allowed !");}
);}

THis line

regx.test('#user')

has you testing the string #user, and that is a string that has a bad character (the #). So it will always say not allowed.

Use the actual value of your $("#user") there by using $(this).val()

$('#alpha').bind('keypress', function (event) {
var regex = new RegExp("^[a-zA-Z\b]+$");
var key = String.fromCharCode(!event.charCode ? event.which : event.charCode);
if (!regex.test(key)) {
   event.preventDefault();
   return false;
}
});

$('#numeric').bind('keypress', function (event) {
var regex = new RegExp("^[0-9\b]+$");
var key = String.fromCharCode(!event.charCode ? event.which : event.charCode);
if (!regex.test(key)) {
   event.preventDefault();
   return false;
}
});

$('#alphanumeric').bind('keypress', function (event) {
var regex = new RegExp("^[a-zA-Z0-9\b]+$");
var key = String.fromCharCode(!event.charCode ? event.which : event.charCode);
if (!regex.test(key)) {
   event.preventDefault();
   return false;
}
});


$('#alphanumericspecial').bind('keypress', function (event) {
var regex = new RegExp("^[a-zA-Z0-9 .]+$");
var key = String.fromCharCode(!event.charCode ? event.which : event.charCode);
if (!regex.test(key)) {
   event.preventDefault();
   return false;
}
});

   function isNotAlphanumeric(){
        return (! val.match(/^[a-zA-Z]+$/))
        //return val.match(/^[a-zA-Z0-9]+$/) ? false : true;
   } 

so if val is alpha numeric it return false. So based on returned value take appropriate action. You can call this method on key up event.

本文标签： jqueryHow to prevent nonalphanumeric input in javascriptStack Overflow