首页前端开发HTMLwordpress添加Html5的表单验证required方法小结

wordpress添加Html5的表单验证required方法小结

时间2024-01-25 06:08:45发布访客分类HTML浏览573
导读:收集整理的这篇文章主要介绍了wordpress添加Html5的表单验证required方法小结,觉得挺不错的,现在分享给大家,也给大家做个参考。 表单验证 是防止垃圾评论的一个方面,wordPress已经自带了严格的验证方法,随着...
收集整理的这篇文章主要介绍了wordpress添加Html5的表单验证required方法小结,觉得挺不错的,现在分享给大家,也给大家做个参考。

表单验证 是防止垃圾评论的一个方面,wordPress已经自带了严格的验证方法,随着HTML5的推广支持,我们可以在WordPRess评论表单上添加Html5的表单验证方法验证方法,增加用户的良好体验

1、required 属性定义和用法

required 属性规定必需在提交之前填写输入字段。
如果使用该属性,则字段是必填(或必选)的。
注释:required 属性适用于以下 类型:text, seArch, url, telephone, email, password, date pickers, number, checkbox, radio , file。
2、修改wordpress的姓名和邮箱必填字段
WordPress 的话,评论框中需要用到email与url(对应电子邮箱,网站)。结合required属性、placeholder属性,原来的代码应该修改为类似如下:

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代码}
    

总结

到此这篇关于wordpress添加Html5的表单验证required方法小结的文章就介绍到这了,更多相关wordpress添加Html5的表单验证required内容请搜索以前的文章或继续浏览下面的相关文章,希望大家以后多多支持!

声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!

上一篇: AmazeUI底部导航栏与分享按钮的示...下一篇:AmazeUi Tree(树形结构) 应用小结猜你在找的html5相关文章 关于移动端h5开发相关内容总结2022-05-17html5教程-学表单的第二天2018-12-10html5教程-HTML5浏览器支持2018-12-10html5教程-HTML5智能表单2018-12-10html5教程-微信H5使用resLoader实现加载页效果2018-12-10html5教程-day01-初级-JS0-热身运动JS入门教程2018-12-10html5教程-html5shiv.js和respond.min.js2018-12-10html5教程-不同浏览器对于html5 audio标签和音频格式的兼容性2018-12-10html5教程-使用Html5实现手风琴案例2018-12-10html5教程-html5笔记2018-12-10 其他相关热搜词更多phpjavapython程序员load

若转载请注明出处: wordpress添加Html5的表单验证required方法小结
本文地址: https://pptw.com/jishu/586207.html
AmazeUI 折叠面板的实现代码 AmazeUI底部导航栏与分享按钮的示例代码

游客 回复需填写必要信息