如何将Name字段限制为HTML中的几个名称？

Question

First Name:<br>
<input type="text" name="firstname" value="First Name" pattern="[Catherine]">
<br>

我希望上面的代码只允许Catherine进入该领域，但不确定我哪里出错。

Answer 1

1. 你的模式应该是

   pattern="Catherine"
   

   没有方括号，在RegEx中具有特殊含义。

   如果要允许多个名称，请使用此RegEx模式：

   pattern="(Catherine|Katie|Kate)"
   

2. 这是一项仅适用于提交表单的验证。它不禁止输入其他名称。如果模式不匹配，浏览器将不会提交表单，而是在输入旁边显示错误弹出窗口。

只允许使用Catherine的示例：

<form>
<input type="text" pattern="Catherine" required />
<input type="submit" value="submit">
</form>

允许多个名称的示例：

<form>
<input type="text" pattern="(Catherine|Katie|Kate)" required />
<input type="submit" value="submit">
</form>

如果您确实只想允许输入该特定单词，请考虑将JS与onInput事件处理程序一起使用。然而，这看起来并不像你真正想要的那样。

编辑：我还添加了required关键字，以防止提交空输入。