如何在TextBox中创建模式?

时间:2016-11-08 10:35:42

标签: javascript jquery html html5 pattern-matching

注意:我厌倦了所有问题&回答相关这个话题。像This

一样

我使用简单的表单使用 URL TextBox 我使用模式 pattern="https?://.+"完美的工作。

我想允许文字(小和大写)赞

1. www.test.com
2. https://www.test.com
3. https://test.com
4. WWW.TEST.COM
5. HTTPS://WWW.TEST.COM*
6. HTTP://TEST.COM

我尝试了代码:

<input name="website" id="website" type="text" class="Custom_textbox"  pattern="https?://.+"/>

注意:仅使用模式尝试解决我的问题。 不是其他剧本

我的代码 Here

1 个答案:

答案 0 :(得分:1)

您可以使用这样的替换:

pattern="(www\.|https?://).+"
         ^     ^         ^

不区分大小写的版本:

pattern="([wW][wW][wW]\.|[hH][tT][tT][Pp][sS]?://).+"

请参阅regex demo。请注意,在限制量词的帮助下,可以缩短不区分大小写的版本:pattern="([wW]{3}\.|[hH][tT]{2}[Pp][sS]?://).+"

它会接受以www.http://https://开头的所有输入。

&#13;
&#13;
input:valid {
  color: black;
}
input:invalid {
  color: red;
}
&#13;
<form name="form1"> 
  <input name="website" id="website" type="text" class="Custom_textbox"
     pattern="([wW][wW][wW]\.|[hH][tT][tT][Pp][sS]?://).+" 
     title="Please valid url" required/>
  <input type="Submit"/> 
</form>
&#13;
&#13;
&#13;