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个字符。根据您的要求更新表达式。

<强>演示：

＆＃13;

input:invalid {
  color: red;
}

＆＃13;

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

＆＃13;

Answer 2

正则表达式模式中的

{50}表示完全 50个字符。这不太可能你想要什么。

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

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

Answer 3

如下面所示：

type="text"->发生文本验证。

pattern="[A-Za-z]{50}"->仅Aa-Zz字母有效，字符输入无效。且字符串长度应等于50。