HTML5文本框重複提示驗證失敗信息的解決方案

使用HTML5 文本框，進行正則表達式驗證的時候，咱們一般會設置提示，例如：

<input type="text" name="hour" placeholder="小時" pattern="^((\d)|(1\d)|(2[0-4]))$" oninvalid="setCustomValidity('請輸入0-23這樣的小時數')" />

可是這樣設置，會有一個問題，一旦輸入出錯，而後再輸入正確的數據，還會不斷彈出驗證失敗的提示。解決方法是，要加入oninput="setCustomValidity('')"，以下

<input type="text" name="hour" placeholder="小時" pattern="^((\d)|(1\d)|(2[0-4]))$" oninvalid="setCustomValidity('請輸入0-23這樣的小時數')" oninput="setCustomValidity('')" />

這樣就能夠了。