javascript - Combine pattern with maxlength of input field - Stack Overflow

admin管理员组

文章数量:1289548

Is it possible to bine a pattern attribute with a maxlength attribute on an input field in jquerymobile?

<input name="aNumber" type="number" pattern="[0-9]{6}" maxlength="6" placeholder="dddddd" value="">
<input name="anotherNumber" type="number" pattern="[0-9]{3,4}" maxlength="4" placeholder="ddd(d)" value="">

I want the big numberpad to appear but that only works using pattern="[0-9]*". Unfortunately the maxlength attribute is not respected in any case.

What I want is a numeric keypad to appear (the big one/dial; the iPhone apparently has two: only numbers/dial and numbers with special chars) letting the user input up to 6 or 3 to 4 numeric chars.

---

Edit: Applied @raina77ow 's suggestion and that works for the moment, but still it feels not right so I'm open to advice!

<input name="aNumber" type="tel" pattern="[0-9]*" maxlength="6" placeholder="dddddd" value="">

Is it possible to bine a pattern attribute with a maxlength attribute on an input field in jquerymobile?

<input name="aNumber" type="number" pattern="[0-9]{6}" maxlength="6" placeholder="dddddd" value="">
<input name="anotherNumber" type="number" pattern="[0-9]{3,4}" maxlength="4" placeholder="ddd(d)" value="">

I want the big numberpad to appear but that only works using pattern="[0-9]*". Unfortunately the maxlength attribute is not respected in any case.

What I want is a numeric keypad to appear (the big one/dial; the iPhone apparently has two: only numbers/dial and numbers with special chars) letting the user input up to 6 or 3 to 4 numeric chars.

---

Edit: Applied @raina77ow 's suggestion and that works for the moment, but still it feels not right so I'm open to advice!

<input name="aNumber" type="tel" pattern="[0-9]*" maxlength="6" placeholder="dddddd" value="">

• javascript
• html
• regex
• jquery-mobile

Share Improve this question Follow edited Jul 2, 2012 at 6:45 mayrs asked Jun 29, 2012 at 15:48 mayrsmayrs 2,38744 gold badges2424 silver badges3636 bronze badges 3

• 1 What about type="tel" maxlength="6" bination, won't it help? – raina77ow Commented Jun 29, 2012 at 20:27
• 1 @raina77ow That helped indeed! Feels dirty though... – mayrs Commented Jul 2, 2012 at 6:39
• Why isn't maxlength respected? – mbomb007 Commented Jan 5, 2015 at 21:47

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 4

{6} means exactly 6 Digits {0,6} means minimum 0 digits and maximum 6 digits

type="tel" pattern="{X,6}" maxlength="6"

if you wanna limit input to strictly numbers (as in math numbers not telephone numbers) go with:

pattern="[0-9]{X,6}"

Where x is an integer number between 0 and 6 will get you the minimum of X and maximum of 6 digits for input.

If you type pattern this way, you need maxlength only for browsers that don't support pattern attribute, I would keep it.

本文标签： javascriptCombine pattern with maxlength of input fieldStack Overflow