javascript - Regex Patterns for HTML5 Text Field - Stack Overflow

admin管理员组

文章数量:1290949

I would like to create a regex pattern in javascript for a html text field that takes an address. So I only want the user to enter [a-z,A-Z,0-9] and only these symbols [,#-.] I also want to prevent the user from sending an empty string and the maximum number of characters to be less than 100.

This is the html <input>:

<input type="text" id="addy" maxlength="100"/>

I'm new to javascript, so I do not know how to create a function that will enable the regex patterns to be adhered to.

Thanks

EDIT

Following the remendation by kolink I tried this:

 <input type="text" style="width:285px" placeholder="Enter A Precise Address" name="address0" id="address"
     pattern="[ a-zA-Z0-9,#.-]+" maxlength="100" title="Standard address notation only"/>

This now only works if the other <select> have not been selected. Otherwise it does not pick up the pattern attribute. However the exact same code works as expected on jsfiddle: / but not in the browser. This is the code in pastebin:

Thanks

I would like to create a regex pattern in javascript for a html text field that takes an address. So I only want the user to enter [a-z,A-Z,0-9] and only these symbols [,#-.] I also want to prevent the user from sending an empty string and the maximum number of characters to be less than 100.

This is the html <input>:

<input type="text" id="addy" maxlength="100"/>

I'm new to javascript, so I do not know how to create a function that will enable the regex patterns to be adhered to.

Thanks

EDIT

Following the remendation by kolink I tried this:

 <input type="text" style="width:285px" placeholder="Enter A Precise Address" name="address0" id="address"
     pattern="[ a-zA-Z0-9,#.-]+" maxlength="100" title="Standard address notation only"/>

This now only works if the other <select> have not been selected. Otherwise it does not pick up the pattern attribute. However the exact same code works as expected on jsfiddle: http://jsfiddle/peD3t/7/ but not in the browser. This is the code in pastebin: http://pastebin./qQGJ4EK5

Thanks

• javascript
• jquery
• html
• regex

Share Improve this question Follow edited Dec 28, 2012 at 23:35 joe asked Dec 28, 2012 at 21:45 joejoe 3511 gold badge11 silver badge77 bronze badges 2

• Show your part of code for this task and people will help with it – edem Commented Dec 28, 2012 at 21:49
• Try something, post it here, and explain what is not working. This is not a do it for me forum. You'll learn when you've tried and failed and then succeeded – Ruan Mendes Commented Dec 28, 2012 at 21:49

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 8

HTML5 gives you the pattern attribute, which allows you to require a certain pattern. In this case, you'd want pattern="[a-zA-Z0-9,#.-]+"

It doesn't matter that older browser don't support this, because you should always validate on the server side.

$(document).ready(function () {

$('input').keyup(function() {
    var $th = $(this);
    $th.val( $th.val().replace(/[^a-zA-Z0-9,#.-]/g, function(str) { return ''; } ) );
});

});

This will work.

本文标签： javascriptRegex Patterns for HTML5 Text FieldStack Overflow