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

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

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

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 时，如果为空则触发，如果输入值则不会触发，效果如下：

资源均来自第三方，谨慎下载，前往第三方网站下载