如何改變「無效輸入」 HTML5的文本形成

Question

如果輸入字段的類型是email在HTML5的形式，如果有人沒有輸入一個有效的電子郵件地址，它會說Please enter an email address.

有一種沒有大量JavaScript的情況下改變文本的方法？ （通過一噸的JavaScript我的意思是另一個實現該輸入字段validadors寫了很多的JavaScript，通常取決於jQuery或其他人）

Answer 1

您可以嘗試設置validationMessage屬性，但我不知道是否有任何瀏覽器尊重它。

這裏是其用於設定自定義消息setCustomValidity

在Firefox例如這裏也是x-moz-errorMessage屬性

實施例：http://jsfiddle.net/XYgJH/

<form> 
<input type="email" oninput="check(this)"/> 
</form> 
<script> 
    function check(input){ 
    if(input.valid){ 
        input.setCustomValidity(''); 
    } else { 
        input.setCustomValidity('silly duck'); 
    } 
} 
</script> 

Answer 2

火狐已經實施了非標準屬性：x-moz-errormessage

所以你可以有這樣的事情，wh ERE當字段爲空的標題文字使用：

<input type=「email」 required x-moz-errormessage=「Wrong!」 title=「Try again」> 

Answer 3

的Firefox目前支持它取代了內置的錯誤消息的屬性x-moz-errormessage。否則，如果您知道驗證即將觸發的時間，則可以使用isValid()和setCustomValidity()臨時設置自定義無效狀態消息。