對于表單驗(yàn)證的使用我們大家都不陌生,今天就和大家分享“html5如何用wordpress添加表單驗(yàn)證?”這個(gè)問題的解決方法和代碼,希望可以幫助到大家的理解!
表單驗(yàn)證 是防止垃圾評論的一個(gè)方面,wordpress已經(jīng)自帶了嚴(yán)格的驗(yàn)證方法,隨著HTML5的推廣支持,我們可以在WordPress評論表單上添加Html5的表單驗(yàn)證方法驗(yàn)證方法,增加用戶的良好體驗(yàn)
1、required 屬性定義和用法
required 屬性規(guī)定必需在提交之前填寫輸入字段。
如果使用該屬性,則字段是必填(或必選)的。
注釋:required
屬性適用于以下 類型:text, search, url, telephone, email, password, date pickers, number, checkbox, radio , file。
2、修改wordpress的姓名和郵箱必填字段
WordPress 的話,評論框中需要用到email與url(對應(yīng)電子郵箱,網(wǎng)站)。結(jié)合required屬性、placeholder屬性,原來的代碼應(yīng)該修改為類似如下:
<input id="author" name="author" type="text" class="form-control" placeholder="昵稱" required="required" value="' . esc_attr( $commenter['comment_author'] ) . '" size="30" />
<input id="email" name="email" type="text" class="form-control" placeholder="272586593@QQ.com" required="required" value="' . esc_attr( $commenter['comment_author_email'] ) . '" size="30" />
3、修改氣泡提示樣式
在主題的style.css
里添加樣式
/*===包含required的表單===*/
/* 無效 */
input:required:invalid{
CSS代碼
}
/* 有效 */
input:required:valid{
CSS代碼
}
總結(jié)
那么當(dāng)我們閱讀到這里的時(shí)候我們本文對于“html5如何用wordpress添加表單驗(yàn)證?”這個(gè)問題的全部內(nèi)容了解就到這里結(jié)束了,更多有關(guān)于Html5 的wordpress內(nèi)容我們都可以在W3Cschool中進(jìn)行學(xué)習(xí)和了解!