自訂 HTML5 表單驗證彈出視窗
使用 HTML5 表單時,預設的驗證彈出視窗有時可能無法令人滿意。然而,需要注意的是,僅使用 HTML 和 CSS 來更改驗證樣式是不可能的。
預設彈出視窗是瀏覽器本身的固有部分。您可以修改的唯一屬性是錯誤訊息,可以使用以下方式設定:
document.getElementById("name").setCustomValidity("Lorum Ipsum");
對於替代解決方案,請考慮使用 jQuery。 Webshims 庫 (https://github.com/jquery/webshim) 提供了一種透過 CSS 覆蓋面板樣式的方法。
這個巧妙的方法可讓您自訂錯誤面板 UI,如本範例所示:http://jsfiddle.net/trixta/qTV3g/。
雖然不是插件,但此方法使用 DOM 程式庫來提供更改預設錯誤彈出視窗的全面解決方案。它代表了實現這種定制的最有效和最優雅的方式。
以上是如何自訂 HTML5 表單驗證彈出視窗?的詳細內容。更多資訊請關注PHP中文網其他相關文章!