html pattern ="[A-Za-z] {50}"表示有效输入无效

Question

我有一个包含一些文本字段的页面,我想限制用户输入,所以我使用了html5模式属性,如下所示:

<input name="team_name" type="text" pattern="[A-Za-z]{50}" value="<?php echo $team_name;?>">

这应该允许我只输入字母b/w Aa-Zz作为名称,但是当我尝试输入有效名称时,它仍然告诉我匹配所请求的格式.我错过了什么？怎么总是告诉我输入无效？

Answer 1

该规则[A-Za-z]{50}只有在包含精确50字母时才会使名称可接受.

[A-Za-z]{10,50}

这将使名称最小为10个字符,最多为50个字符.根据您的要求更新表达式.

演示:

input:invalid {
  color: red;
}

<form>
  <input name="team_name" type="text" pattern="[A-Za-z]{10,50}" value="">
  <br />
  <input type="submit">
</form>

Answer 2

{50}在正则表达式模式中意味着正好 50个字符.这不太可能你想要的.

如果要将输入限制为最多50个字符,请使用该maxlength属性.

<input name="team_name" type="text" pattern="[A-Za-z]+" maxlength="50">