2016-05-07 36 views
4

我需要確保某個字段只需要一些默認字母字符後的數字就像XXX-XX-1234。這裏XXX-XX-是不應該被刪除的默認字符。這些字母后,我希望用戶無法鍵入除數字以外的任何字符。

有沒有一個很好的方法來實現這一目標?只允許一些字母后的數字?

+2

可能重複的[防止輸入任何輸入不匹配正則表達式的jquery插件](http://stackoverflow.com/questions/425497/jquery-plugin-for-preventing-entering-any-input-not-matching- a-regexp) –

+0

http://www.w3schools.com/jsref/jsref_obj_regexp。asp;) –

+0

可能有,但這是Stackoverflow,所以:你試過了什麼,在你寫的代碼中你卡住了什麼? –

回答

2

您可以在您的情況下輸入正則表達式太

<input type="text" name="my_name" 
    pattern="[A-Za-z]{3}-[A-Za-z]{3}-[A-Za-z]{3}-[0-9]{4}" title="my title"> 

(刪除數字)

<input type="text" name="my_name" value="ABC-DE" 
    pattern="[A-Za-z]{3}-[A-Za-z]{2}-" title="my title"> 
+0

請注意,這是從IE11支持,部分支持Safari和iOS – andlrc

+0

您可以在http://caniuse.com/#feat=input-pattern – scaisEdge

+0

看到支持級別有沒有JavaScript涉及這裏? –

2

這裏做的是FIDDLE

我希望我能做出這樣的評論@scaisEdge的答案,因爲我只是建立了它來添加一些有用的東西,但它太適合評論:

HTML:

<form> 
 
    <button>submit</button> 
 
    <input type="text" name="name1" value="ABC-DE-" pattern="[A-Za-z]{3}-[A-Za-z]{2}-\d{4}$" title="LLL-LL-DDDD - L is any letter, D is any digit" /> 
 
    <input type="text" name="name2" value="XXX-XX-" pattern="XXX-XX-\d{4}$" title="XXX-XX-DDDD - D is any digit, rest as is" /> 
 
</form>

我用他的回答爲基礎,然後做了以下說明更多:

  • 我補充說: 「\ d {4} $」到正則表達式模式結束強制4個數字然後沒有別的
  • 我添加了一個新的文本輸入,顯示如何強制顯式指定特定字符Ëalphebetic /劃線部分
  • 我添加的節目有幫助的模式暗示,因爲這些都在彈出窗口中顯示圖案時,拒絕
  • 我把它所有的形式提交按鈕,以顯示它是如何協同工作

什麼不該做

我花了很多時間「滾動我自己的」代碼,使一個版本的文本輸入是特別限制在它前面的所有行動(對輸入變化,KEYDOWN,鍵盤,鼠標點擊)只允許放入最後4位數字,沒有其他的。它變成了「追逐角落案例」的遊戲,我很快就確信,使用經開發人員社區徹底審查的插件或庫是實現這種努力的方式,或使用上述的模式屬性。

這不僅是「垂直導向」這種特定的模式,即使經過很長時間才能消除所有角落的情況,但它仍然被打破。

我甚至解釋了這些困難,並在這個答案中提出了代碼和我的FIDDLE,但是意識到在StackOverflow上放置破碎的代碼並不是一個好主意,所以我剛纔做了相應的編輯來重做這個解釋並擺脫FIDDLE和我試過的替代路線的代碼。