jQuery验证不起作用.你能告诉我这个代码是对的还是错的吗

Question

Im使用jQuery验证，验证工作正常，但在填写字段后，单击提交按钮总是显示其不是有效的表单警报消息。。但是所有的字段都被填满了。。我不知道为什么被限制提交。。

有人告诉我为什么？

你能告诉我代码中有什么错误吗？？？？

小提琴密码在这里。。

Fiddle代码在这里。。

这是我的密码。。

$(document).ready(function() {
$('#contactForm').validate({
rules: {
accountName: {
required: true
},
narr: {
required: true
},
debit: {
required: true
},
cashactcode: {
required: true
}
},
submitHandler: function(form) {
alert('valid form');
return false;
}
});
$('#cashSub').on('click', function() {
$('#contactForm').valid();
alert('its not a valid form');
return false;
});
});

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<!-- jquery validation cdn -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery.bootstrapvalidator/0.5.2/css/bootstrapValidator.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.bootstrapvalidator/0.5.2/js/bootstrapValidator.min.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.19.0/jquery.validate.js"></script>
<form id="contactForm">
<div class="table-wrapper">
<div class="table-scroll">
<table class="table table-bordered table-hover order-list" id="tab_logic">
<tbody>
<tr id="fst_row" class="form-group">
<td>
<select class="form-control sel_sel required" id="payacc" name="actname" for="actname" value="">
<option value="">Select TDS A/c name</option>
<option value="1">TDS A/c 1</option>
<option value="2">TDS A/c 2</option>
<option value="3">TDS A/c 3</option>
</select>
</td>
<td class="form-group">
<input type="text" class="form-control price required" id="pay_narrat" name="narr" for="narr" data-toggle="modal" maxlength="200" data-target="#narratModal" placeholder="Enter your text here" />
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="form-group col-4 vocSub" style="margin-bottom: 0px !important;">
<div class="col-md-12 cashform_submit" id="">
<input type="submit" class="btn add-btn submit-btn load cashmainBtn" id="cashSub" />
</div>
</div>
</form>

Answer 1

valid方法返回表单是否有效。你在呼叫它，然后无论发生什么都显示警报。代码应该是：

$('#cashSub').on('click', function() {
if ($('#contactForm').valid()) {
// do a thing here with the form data (it is valid)
} else {
alert('its not a valid form');
}
return false;
});

这是函数的文档。如您所见，它返回Boolean。