请检查下面的JS小提琴:
https://jsfiddle.net/lfz567tw/
我创建了一个表格,当我输入时,它选择了下一个输入,最后提交表单。
但是,此功能会禁用我的验证功能,并且在提交表单时,函数Validate()不起作用。
提交表格时,我是否有任何方法可以发射功能validate()
?
有一个简单的示例可以向您展示如何在表单提交之前检查或调用验证函数
e.preventDefault :用于防止默认功能
$(function() {
$("#entertonext").submit(function(e) {
e.preventDefault();
// validate code (calling function)
validate();
});
});
function validate() {
alert('Validating');
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div class="card-block" id="entertonext">
<form name="bank" action="#" method="post">
<div class="form-group row" >
<label for="default-input" class="col-sm-2 form-control-label">Account No.</label>
<div class="col-sm-10">
<input type="text" class="form-control entertonext" name="acc_no" id="acc_no" placeholder="Account No." tabindex="1" onblur="validate(this,event)">
<span id="msg8"></span>
</div>
</div>
<div class="form-group row">
<label for="default-input-rounded" class="col-sm-2 form-control-label">Branch Name</label>
<div class="col-sm-10">
<div class="input-group icon icon-lg icon-color-primary">
<input type="text" class="form-control entertonext" name="b_name" id="b_name" placeholder="Branch Name" tabindex="2">
</div>
<span id="msg2"></span>
</div>
</div>
<div class="form-group row" id="drawn" >
<label for="default-input" class="col-sm-2 form-control-label">IFSC Code</label>
<div class="col-sm-10">
<input type="text" class="form-control entertonext" name="ifsc_code" id="ifsc_code" placeholder="IFSC Code" tabindex="3">
<span id="msg5"></span>
</div>
</div>
<div class="form-group row" id="deposited">
<label for="default-input" class="col-sm-2 form-control-label">Address</label>
<div class="col-sm-10">
<textarea class="form-control entertonext" name="address" id="address" placeholder="Address" tabindex="4"></textarea>
<span id="msg6"></span>
</div>
</div>
<div class="form-group row" id="deposited">
<label for="default-input" class="col-sm-2 form-control-label">Bank Balance</label>
<div class="col-sm-10">
<input type="text" class="form-control entertonext" name="balance" id="balance" placeholder="Bank Balance" tabindex="5">
<span id="msg6"></span>
</div>
</div>
<div class="form-group row">
<div class="col-sm-10">
<button type="submit" class="btn btn-primary entertonext" tabindex="6">Submit</button>
</div>
</div>
</form>
</div>