javascript - 使用 jQuery 让页面延迟重新加载

Question

我想在提交表单时设置 3 秒延迟。现在，在提交时，标准文本会淡出，通知文本会淡入，但页面会在您有机会阅读之前重新加载。

<script type="text/javascript"> function changeText() { 
$('#free-planner').fadeOut('slow', function() {
       document.getElementById('free-planner').innerHTML = 'Check your email!';   }); {  $('#free-planner').fadeIn('slow', function() {  });    
 }   
} 
</script>

Answer 1

首先，阻止提交事件，然后在您准备好时以编程方式触发它。

$('form').on('submit', function(ev) {
  ev.preventDefault();
  form = $(this);
  fp = $('#free-planner');
  fp.fadeOut('slow', function () {
    fp.text('Check your email!').fadeIn('slow', function() {
      form.submit();
    });
  });
});

所有这些事情都应该在表单提交之后发生。也许您想要一个隐藏的 iframe 作为表单的目标？然后您可以提交表单而无需更新浏览器中的当前页面。就像是：

form = $('form');
$('body').append($('<iframe>').attr({ name:"hiddenifr", id:"hiddenifr" }).css({ display: 'none' }));

form.attr('target', 'hiddenifr');
form.on('submit', function(ev) {
  fp = $('#free-planner')
  fp.fadeOut('slow', function() {
    fp.text('Check your email!').fadeIn('slow');
  });
});