HTML5：有什麼方法可以顯示輸入字段的錯誤信息？

我創建了一個帶有HTML5功能的表單。我使用setCustomValidity函數自定義錯誤消息。但大多數輸入字段需要顯示錯誤消息onfocusout事件。我爲此做了這個代碼。HTML5：有什麼方法可以顯示輸入字段的錯誤信息？

$("form").bind("change" , function(e){ 
    var ele = e.target; 
    if(field.is(":invalid")){ 
     ele.setCustomValidity(errorMessage); 
    }else{ 
     ele.setCustomValidity(''); 
    } 
});

enter image description here

但是，我不知道怎麼在這裏開設泡沫彈出。

來源

2013-04-13 kannanrbk

我不明白你的問題非常好。你是否試圖在用戶「離開」輸入時運行該代碼（即：「blur」事件）？ – Uby

@Uby，我附上了圖片。 – kannanrbk

http://stackoverflow.com/questions/15820780/jquery-support-invalid-selector – adeneo

是的，但是您需要在表單上輸入checkValidity()，然後如果它是錯誤的，請提交。這不是最好的代碼。

if(!$('form')[0].checkValidity()) { 
    $('form').submit(); 
}

請記住，並非所有瀏覽器都支持表單驗證。我親自離開驗證，因爲瀏覽器擁有它，因爲這是用戶將習慣的。

來源

2013-04-13 12:59:49 scottheckel

最好使用JavaScript庫來觸發驗證，並且您還可以設置用於驗證的自定義消息。

參考鏈接：Link

使用這個你可以觸發驗證消息上onfocusout

下載CSS和JS從上面的鏈接，並添加到您的HTML頁面。根據您的要求添加驗證規則。

<input type="text" name="emp_code" id="emp_code" data-rule="emp_code|required">

這裏required是預定義的規則和emp_code是由用戶創建的自定義規則。

最後一步是初始化庫。

<script> 
// #form is id of form 
new Validator(document.querySelector('#form'), function(err, res) { 
    return res; 
} 
</script>

來源

2018-01-06 09:19:41

儘管這個鏈接可能回答這個問題，但最好在這裏包含答案的基本部分，並提供供參考的鏈接。如果鏈接頁面更改，則僅鏈接答案可能會失效。 - [來自評論]（/ review/low-quality-posts/18441143） – AsifAli72090

@ AsifAli72090謝謝。 –

HTML5：有什麼方法可以顯示輸入字段的錯誤信息？

回答

相關問題