jquery - 是否可以在非必填字段上使用 HTML5 验证？

Question

我在验证非必填字段时遇到问题。当有人在此字段上激活验证时，即使字段为空，也无法将其发送到服务器。我的 html 代码如下所示:

<form>
    <input pattern=".{6,}" name="field" size="25" type="text" />
    <input type="submit" />
</form>

我还使用 jQuery 来自定义验证消息:

$(function(){
    $("input[name=field]")[0].oninvalid = function () {
        this.setCustomValidity("Please enter at least 5 characters.");
        this.setCustomValidity("");
    };
});

Answer 1

如果我理解正确，当您再次更改字段时，您将 CustomValidity 设置为空，而不是在 oninvalid 事件处理程序中。试试这个

$(function(){
    $("input[name=field]")[0].oninvalid = function () {
        this.setCustomValidity("Please enter at least 5 characters.");


    };

 $("input[name=field]")[0].onchange = function () {
        this.setCustomValidity("");
    };    

});