我應該在html5輸入正則表達式模式驗證中使用^和$嗎？

Question

我見過大多數沒有^（circumflex）和$（貨幣或美元）字符的例子來標記匹配字符串的結尾。 但是，我在html5規范中沒有找到任何相關內容。 它們隱含在模式中嗎？ html5規范聲明它們是隱含的。

編譯后的模式正則表達式在與字符串匹配時，必須將其開始錨定到字符串的開頭，並將其結束錨定到字符串的結尾。 這意味着用於此屬性的正則表達式語言與JavaScript中使用的正則表達式語言相同，只是模式屬性與整個值匹配，而不僅僅是任何子集（有點像它隱含了^（？：at start）模式和a）最后的$）。

在type =“text”輸入中，模式使用任一格式都可以正常工作，但是在type =“tel”輸入中，我必須刪除正則表達式的字符才能按預期工作。 我已經在Opera和Firefox中進行了測試。

這是一個瀏覽器錯誤嗎？ 我應該在bugzilla等中提交錯誤嗎？

---

編輯：似乎我偶然發現了一個奇怪的錯誤，因為我無法創建一個簡化的測試用例。 頁面中的簡單輸入不會顯示上述行為。 但問題仍然存在。 我應該，還是不應該使用darn ^和$ anchors？

Answer 1

關於pattern屬性的HTML標准部分仍然聲明它始終錨定在開頭和結尾，正如問題中引用的那樣：

編譯后的模式正則表達式在與字符串匹配時，必須將其開始錨定到字符串的開頭，並將其結束錨定到字符串的結尾。

我們可以使用簡單的測試代碼段來確認此行為：

 <form> <input required pattern="abc"> <button>Submit</button> </form> 

你會注意到上面的表格拒絕了foo abc和abc foo ; 只接受鍵入abc的字符串將被接受。 這表明pattern="abc"等同於pattern="^abc$" ，並且您不需要明確指定^和$ 。

據我所知，這里的競爭答案聲稱用於實現不同行為的瀏覽器違反規范，完全是錯誤的。 你可以從https://ftp.mozilla.org/pub/firefox/releases/15.0/win32/en-GB/下載Firefox 15並自己測試上面的代碼片段，你會看到行為只是就像在現代瀏覽器中一樣。 或者，既然你可能不會被打擾，你可以查看我這樣做的截圖：

Answer 2

根據標准， 正則表達式錨定在開始和結束 。 然而， 在實踐中 （經過測試的FF 15和Chrome 21）它僅在開始時錨定！

因此，如果您希望兼容標准和現實，則應該明確地使用$錨定正則表達式。 是否使用^也取決於你 - 沒有必要。

Answer 3

當然你知道電話號碼有不同的形式，

例如

• 在奧地利維也納，撥“4000”將連接到市政廳。
• 在奧地利因斯布魯克，您需要撥“014000”撥打維也納市政廳
• 在美國紐約時，您需要撥打+4314000以撥打相同的號碼。

這有歷史原因，舊的機械系統委托將呼叫從一個設備連接到下一個設備的每個數字的工作（這也是為什么擴展在數字的末尾而不是在開始時的原因，而不是DNS，您可以在前面擴展您的域名，但不能在最后擴展您的域名）

現在一個帶有錨點^和$的正則表達式只會匹配一個電話號碼，如果它以完全相同的形式給出。 只有$ anchor，它將可靠地匹配相同的電話號碼，只要沒有給出不同的擴展名。 沒有錨點，即丟棄^和$將匹配獨立的位置代碼和擴展名，但會引入不可靠性：

使用“4000”作為維也納市政廳的模式將匹配“4000”，“014000”和“+4314000”，但它也將匹配“+44140001”，這是德國銀行。