未显示函数结果的错误文本

Question

我以前在其他页面上成功地使用了这个定义。基本上，它应该使该字段成为必填字段，但如果仅输入空格，则会失败(默认情况下键入，即单个空格会导致所需的检查通过(。我扔了一个警报，只是为了看看处理程序何时被触发以及当时this的值。它在我期望它时被触发，并且值是我期望的。它应该返回false但显然不是因为未显示错误。如果我删除该depends函数并只具有required: true，则当用户离开字段时，它会正确显示错误。这是怎么回事？

ContactName: {
required: {
depends: function() {
alert("'" + $(this).val() + "'");
if ($.trim($(this).val()).length === 0) {
$(this).val($.trim($(this).val()));
return false;
}
return true;
}
},
maxlength: 100
}

Answer 1

您可以更改联系人姓名的规则，例如(有关详细信息，请查看规则示例(：

ContactName: {
required: true,
minlength: {
depends: function(ele) {
if (ele.value.trim().length === 0) {
ele.value = '';
return false;
}
return true;
}
},
maxlength: 100
}

代码段：

$("#commentForm").validate({
rules: {
ContactName: {
required: true,
minlength: {
depends: function(ele) {
if (ele.value.trim().length === 0) {
ele.value = '';
return false;
}
return true;
}
},
maxlength: 100
}
},
messages: {
ContactName: "Please enter your contact name"
}
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.16.0/jquery.validate.min.js"></script>
<form class="cmxform" id="commentForm" method="get" action="">
<fieldset>
<p>
<label for="ContactName">Name</label>
<input id="ContactName" name="ContactName" type="text">
</p>
<p>
<input class="submit" type="submit" value="Submit">
</p>
</fieldset>
</form>