我试图隐藏按钮 div 并在单击表单按钮并延迟提交/重定向后显示隐藏的 div。以下是我想出的,但似乎没有 100% 有效。
$('form').submit(function(e) {
e.preventDefault();
$('#checking').show();
$('.button').hide();
setTimeout(() => {}, 7000);
return true;
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form>
<input type="text" placeholder="Enter Name" name="details" />
<input type="submit" class="button" value="CHECK" />
</form>
<div id="checking" style="display: none;">
CHECKING DETAILS... Please wait
</div>
非常感谢任何建议
答案 0 :(得分:0)
假设您要显示消息然后提交,请执行此操作
$('form').on("submit", function(e) {
e.preventDefault();
$('#checking').show();
$('.button').hide();
setTimeout(() => {
// submit the DOM form
document.getElementById("myForm").submit(); // or $("#myForm")[0].submit()
}, 7000);
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form id="myForm">
<input type="text" placeholder="Enter Name" name="details" />
<input type="submit" class="button" value="CHECK" />
</form>
<div id="checking" style="display: none;">
CHECKING DETAILS... Please wait
</div>
答案 1 :(得分:0)
在您的计时器回调中,您需要提交表单,但是当您执行 sumbit
回调时会一次又一次地调用 e.preventDefault()
,因此您可以使用变量作为“标志”来检查您是否应该取消活动。
let flag = false;
$('form').on("submit", function(e) {
if(!flag){
e.preventDefault();
$('#checking').show();
$('.button').hide();
flag = true;
}
setTimeout(function(){
$('form').submit();
}, 7000);
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form action="https://www.example.com" method="Post">
<input type="text" placeholder="Enter Name" name="details" />
<input type="submit" class="button" value="CHECK" />
</form>
<div id="checking" style="display: none;">
CHECKING DETAILS... Please wait
</div>