主页 > 教程合集 > Html/css >

修改浏览器自带“请填写此字段” required必填校验的方法

时间:2020-11-17 阅读:0

HTML5版本里新增的required,不需要任何JS判断,即可对填写项进行判断,为空的时候提示:“请填写此字段”。

修改浏览器自带“请填写此字段” required必填校验的方法

我们如何修改这个提示字呢?

JS代码:


function validate(input, msg){
        if($(input).val().trim().length > 0){
                msg = '';
        }
        $(input).attr('oninvalid',"this.setCustomValidity('"+msg+"')").trigger('oninvalid');
}
 

HTML代码:


<input id="username" name="username" oninput="validate(this,'用户名不能为空')" type="text" placeholder="登录用户名/邮箱"/>
<input id="password" name="password" oninput="validate(this,'密码不能为空')" type="password" placeholder="密码"/>
 

注意:不需要属性 required="required" 

在点击form submit 时,如果为空则触发,如果输入值则不会触发,效果如下:

修改浏览器自带“请填写此字段” required必填校验的方法

修改浏览器自带“请填写此字段” required必填校验的方法

升级为终身VIP,即可免费下载全站所有千余TB网络资源,点击 >>> 资源目录 查看所有资源,覆盖音乐、影视、有声书、电子书、漫画、动漫、课程等,不限时间次数,永久免费,点击 >>> VIP特权 了解更多!

余斗余斗
  • 版权声明:原创文章由发表在Html/css分类下,2020-11-17最后更新,转载注明出处。

相关推荐

下一篇:没有了
返回顶部