3

我在 JQUERY fadeIn 末尾发布了一个表格。

  • 当用户点击提交时 - 一个 DIV ' SWITCHING_SCREENS ' - 其中包含一条消息，通过 JQUERY 淡入并覆盖表单页面。
  • 一旦该 div 完全淡入 - javascript 然后将表单发布到另一个页面。

Javascript：

    Theform = document.getElementById('customers_form');

    $('#SWITCHING_SCREENS').fadeIn('slow', function(){
        Theform.submit();
    });

这一切都很好，我对提交或其他任何事情都没有问题。但是如果用户随后点击浏览器后退按钮（firefox） - SWITCHING_SCREENS 仍然可见。

我已经看到表单元素的后退按钮缓存 - 但希望 JQUERY 在后退按钮上重置。或者我只是没想到它会缓存。

  • 好像已经缓存了？
  • JQUERY 是否缓存了 DIV 的这种状态？

我努力了：

Javascript：

Theform = document.getElementById('customers_form');

$('#SWITCHING_SCREENS').fadeIn('slow', function(){
    Theform.submit();
    $('#SWITCHING_SCREENS').hide();
});

当使用浏览器后退按钮时，这确实修复了 DIV 在“淡入”状态下的缓存......

但它也会在页面实际切换到发布页面之前删除 DIV。我希望 div 在页面发布到下一页时保持可见 - 如果访问者点击后退按钮则消失。

这似乎只发生在 Firefox 中。

谢谢你。问候。

4

4 回答 4

1

您可以使用.unload()它不会专门拦截后退按钮，而是任何卸载当前页面的事件。它可以是基于浏览器单击链接、前进按钮或后退按钮的任何内容。

$(window).unload( function () { $('#SWITCHING_SCREENS').hide(); });

当用户离开页面时，unload 事件被发送到窗口元素。这可能意味着许多事情之一。用户可以单击链接离开页面，或者在地址栏中输入新的 URL。前进和后退按钮将触发事件。关闭浏览器窗口将导致事件被触发。即使是页面重新加载也会首先创建一个卸载事件。

于 2013-06-14T12:18:43.317 回答
0

不是 jQuery 缓存了任何东西，而是浏览器缓存了用户最后一次看到的页面状态。这是正常的，有人说是更可取的行为。例如，如果您滚动到页面底部，然后单击链接（将您带到新页面），然后单击返回按钮，浏览器甚至可能再次将您带到页面底部，就在您所在的位置留下它。

所以我建议如下：

$('#SWITCHING_SCREENS').fadeIn('slow', function(){
    $(window).unload( function () { $('#SWITCHING_SCREENS').hide(); });
    Theform.submit();
});
于 2013-06-15T23:12:59.573 回答
0

嘿，我不是 100% 确定您要做什么，但这可能会有所帮助，但听起来您希望用户位于表单页面 1. 点击提交 2. 等待表单 3. 然后转移到另一个页面

  $(document).on('click', 'a', function(event){ 

        $.post(
            $(this).attr('href'),
            {url: "url",
             dataType: "html",
            },
            function( data )
            {

        $('#content').fadeOut(function(){
        $(this).replaceWith(data).fadeIn(); 

         });
        }
        );
        return false;
    });

如果您回击或转发，这将提交表单从服务器加载新页面而不记录 url，它重新加载页面只是为了显示表单

php端 

<?php
// Determing if this is an include or ajax call
if( $_POST["url"] = $_POST['url'] ){ ?>

<div id="content">
new page data
</div>

<?php  }else{ ?>


 <div id="content">

your form </div>

<?php } ?>

这更像是一个“hack”，我很抱歉 jquery 的新手。

于 2013-06-16T00:58:23.587 回答
0

将此代码放在页面加载上。 

$(document).ready(function({  
    $('#SWITCHING_SCREENS').hide();
    ..... rest of your code will go here.........
}));
于 2013-06-10T22:20:55.917 回答