我在表单提交后显示加载消息,如下所示:
<div id="loading" style="display:none;"><img class='image-widthauto' src="/img/Progressbar.gif" /></div>
<div id="content-alert"></div>
<form id="login" method="POST" action="" onsubmit="$('#loading').show();">
..... //input
</form>
我使用 jquery validation 验证我的表单插件:
$(document).ready(function () {
$("#login").validate({
errorElement: "div",
errorPlacement: function(error, element) {
error.appendTo("div#content-alert").addClass('alert alert-danger');
},
rules: {
name: {
required: true,
minlength: 6,
alpha: true,
},
},
messages: {
name: {
required: "requied message",
minlength: "6 character"
},
}
});
});
现在,在表单提交中我看到加载消息和验证错误框(提交空表单值)。当我的表单使用验证插件没有错误时,我需要显示加载消息。
如何解决这个问题?
最佳答案
不使用 onsubmit
属性,而是使用验证器的 submitHandler
回调
$(document).ready(function () {
$("#login").validate({
errorElement: "div",
errorPlacement: function (error, element) {
error.appendTo("div#content-alert").addClass('alert alert-danger');
},
rules: {
name: {
required: true,
minlength: 6,
alpha: true,
},
},
messages: {
name: {
required: "requied message",
minlength: "6 character"
},
},
submitHandler: function (form) {
$('#loading').show();
form.submit();
}
});
});
关于javascript - jquery 在表单验证后显示/隐藏 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26276469/