如何防止Bootstrap Modals出现在浏览器历史记录中?

时间:2015-07-18 14:25:46

标签: javascript jquery twitter-bootstrap

考虑这种情况

用户访问页面A,进入页面B,单击启动模式的链接(下面的代码)

<a href="mycontent.html" data-target="#modal_xl" data-toggle="modal" data-backdrop="static">Click me</a>

填写表格,提交表格,模态关闭,重新加载页面。

问题

在Firefox中,如果用户按下后退按钮,则会将其转到页面A(预期的面值行为)。浏览器历史记录是第B页 - &gt;第A页

但是,在Chrome和Safari中,当用户按下后退按钮时,它们会再次被带到Page B.浏览器历史记录是第B页 - &gt;第B页 - &gt;第A页。

似乎在Chrome和Safari中,模式/页面重新加载在页面B上注册为另一页面访问。如果此表单提交4或5次,则用户必须按下后退按钮4或5次才能到达他们期望成为上一页。

半个解决方案

我在页面重新加载时将以下代码附加到页面B

if(document.referrer == window.location.href) {
    window.history.back();
}

这适用于Chrome和Safari,因为它会让用户退回历史记录中的一步,这意味着当他们按下后退按钮时他们会返回到页面A.但是在Firefox中,它会将用户返回到页面A,因为Firefox没有&# 39;将模态注册为第二次/单独页面访问,这是不合适的。

构建浏览器检测是修复firefox问题的一种方法,但它有点脏/ hacky,而且这种方法也会激活浏览器&#34;转发历史记录&#34;。

有没有办法阻止模式添加浏览器历史记录?

1 个答案:

答案 0 :(得分:0)

如果你不打算提交像图像或文件这样的数据,你可以考虑 使用ajax提交数据。因此,在任何浏览器中,您的历史记录都是Page A - &gt;第B页。