2015-05-27 157 views
1

我有以下代碼:HTML輸入正則表達式模式

<body> 
    <form action="" method="post"> 
     <div> 
      <label>First Name: <input type="text" name="firstname" value=" " pattern="[a-zA-Z ]+"></input> </label> 
     </div> 
     <div> 
      <label>Last Name: <input type="text" name="lastname" value="" pattern="[a-zA-Z ]+"> </input> </label> 
     </div> 
     <div> 
      <label>Voucher: <input type="text" name="voucher" value="" pattern="^[0-9]{5}+[-]+[0-9]{5}+[-]+[A-Z]{2}*"></input> </label> 
     </div> 
     <input type="submit" value="Submit"></input> 
    </form> 
</body> 

上面的代碼是我的代碼,姓氏和名字都是工作,問題是憑證輸入不檢查我想要的模式,它應該看起來像「12345-67890-AB」。

+0

你不需要'+'因爲你已經說你需要5個字符 – PeeHaa

+1

你不需要''^在開始的正則表達式(最後也不是'$')。 [HTML表單的模式屬性暗示](http://www.w3.org/TR/html5/forms.html#the-pattern-attribute) –

回答

3

取出+ S和最終*,並在末尾加上$

^[0-9]{5}[-][0-9]{5}[-][A-Z]{2}$ 

或者自pattern attribute does not require anchoring,您還可以使用

[0-9]{5}[-][0-9]{5}[-][A-Z]{2} 

demo

說明:

  • ^ - 5位數字組成
  • [-] - - 一個字符串(不必需的,因爲pattern串被錨定)
  • [0-9]{5}開頭正好1個連字符
  • [0-9]{5} - 5位數字組成
  • [-] - 切合1連字符
  • [A-Z]{2} - 2個大寫英文字母。
  • $ - 字符串結束(再次,可以省略,因爲模式錨定)。
+0

@iouhammi:這個正則表達式非常通用,它可以用於JavaScript和其他大多數口味。 –

+0

謝謝!這個也適用!感謝您的解釋! – hohoho

+0

不客氣。好問題,很好的答案:) –