2017-10-12 129 views
1

Codepen示例:
https://codepen.io/Trost/pen/KXBRbY
嘗試在這兩個字段中放置1個符號。
我不明白什麼是錯的。如果我在https://regex101.com中測試這些正則表達式,它們看起來是相同的。Html正則表達式模式:[ d s - ] {3}起作用,但[ d- s] {3}不起作用。爲什麼?

<form> 
    Works: <input type="text" name="country_code" pattern="[\d\s-]{3}" title="-23" required> 
    <input type="submit"> 
</form> 
<form> 
    Bug: <input type="text" name="country_code" pattern="[\d-\s]{3}" title="- 3" required> 
    <input type="submit"> 
</form> 
+2

'''在'[]'字符類的中間使用時具有特殊含義。但是在它周圍有'\ d'和'\ s',它沒有什麼意義,所以根據實現它可能會失敗。在'[\ d \ s-]'中,但它在課程的最後,這意味着它沒有特殊的含義。 –

+1

這是因爲您使用regex101.com和HTML5模式使用PCRE選項進行測試,所以使用'u'選項將其解析爲ES6正則表達式。 –

回答

1

的真正根源在這裏的原因是正則表達式[\d-\s]pattern HTML5屬性被使用,並且在Chrome和Firefox的最新版本編譯爲與u修飾符ES2015兼容的正則表達式。結果是,對於Unicode正則表達式模式,有更嚴格的轉義規則

enter image description here

它的意思是,每當一個字符不能明確分析,這是一個錯誤。當一個char被轉義,但不需要轉義時,它又是一個錯誤。

,你可以在字符類逃脫u基於正則表達式中的字符是+$^*()|\[].?-{}(見this source)。如果-位於字符類的開始/結尾處,它仍然可以非轉義,因爲它只能在那裏被解析爲文字連字符。

在兩個速記字符類之間,非轉義的-將產生一個錯誤,因爲它被視爲用戶錯誤。

因此,要麼在開始/結束處放置一個連字符(它始終是最佳選項),要麼在字符類中轉義它(並且永遠不會在字符類外部轉義它)。

+0

謝謝。我忘了用「 - 」來定義符號範圍。而且它在regex101.com上的工作讓我更加困惑。 TIL:你可以使用/regex/.test("teststring「);在JS控制檯中測試正則表達式。 – Trost

+0

@Trost [Regex101也有它自己的錯誤。](https://regex101.com/r/cvFxtw/1) –

1

定義兩個不同的東西:

  • [a-z]是一個範圍的定義 - 所有字符從az
  • [az-]是一組三個元素的定義 - a,z-
相關問題