HTML5 使用包含引号的模式验证文本输入

Question

这不是这些“帮助我构建我的正则表达式”问题之一。我有一个 HTML 表单输入字段，用户可以在其中提供各种格式的地理位置数据。以下正则表达式在regexr.com以及我的应用程序中都可以正常工作。但是，我想使用 HTML5 的“模式”参数在提交之前额外验证用户的输入。

((([E|W|N|S](\s)?)?([\-]?[0-1]?[(0-9)]{1,2})[°][ ]?([(0-5)]?[(0-9)]{1})([\.|,][0-9]{1,5})?['][ ]?([0-5]{0,1}[0-9]?(([\.|\,])[0-9]{0,3})?)([\"]|[']{2}){0,1}((\s)?[E|W|N|S])?)|([-]?[1]?[0-9]{1,2}[\.|,][0-9]{1,9}))

关键是这个正则表达式包含一个引号字符 (")。现在，我把这个正则表达式放在我的输入中，如下所示：

<input type="text" pattern = "regex..."...." />

浏览器无法识别此正则表达式，并且根本不进行任何验证，因此显然我需要转义该引用。到目前为止我尝试过的：

• PHP 的addslashes() 函数转义了太多字符。
• 我用一个反斜杠转义了引用

这并没有改变任何事情。我用 Chrome 进行了测试，它可以很好地处理简单的正则表达式。上面那个显然有点太复杂了。

我知道上面的正则表达式对于匹配坐标并不完美，但是，这里不讨论。我只想知道如何正确转义 HTML5 中的模式，因为 Chrome 对该正则表达式没有任何作用。

Answer 1

使用 HTML 实体：

• 而不是'使用'
• 而不是"使用"

如果您使用 PHP 创建正则表达式，则可以使用htmlentities()HTML 实体对字符串进行编码。默认情况下，这只会对双引号进行编码，但您可以使用该ENT_QUOTES选项对两种类型的引号进行编码。