Question

我正在使用HTML5模式进行表单验证。我希望我的输入字段允许只包含以下字符的任意组合。

, @ – - . ; / ' : ( ) # a-z A-Z 0-9 space

我一直在尝试创建模式来实现这一目标。我以为我想出了一个使用regexr.com的解决方案。在该网站上，我的模式效果很好，但在我的表单中实现时，所有内容都显示为无效条目。例如'Test'无效'Test D'luxe'无效，'公司测试＃1'无效等等。

My Results on RegExr

以下是我提出的模式：

pattern="[a-zA-Z[\d\[\-\.\_,\(\)\#\:\;\'\/]"

我已经查看过其他一些堆栈溢出帖子，例如

但是我无法将我正在做错的事情拼凑起来。我将不胜感激任何帮助。我对此非常陌生，所以我愿意接受任何反馈。

Answer 1

您应该在最后添加*量词，允许0+个字符，将'替换为\x27并删除冗余转义：

pattern="[-,@–.;/\x27:()#a-zA-Z0-9 ]*"

input:valid {
  color: green;
}
input:invalid {
  color: red;
}

<form name="form1"> 
 <input value="-,@–.;/':()#azAZ09 " pattern="[-,@–.;/\x27:()#a-zA-Z0-9 ]*" title="Please enter allowed characters only."/>
 <input type="Submit"/> 
</form>

HTML5表单验证模式

1 个答案: