如何在点击后退按钮时刷新页面?

问题描述 投票:0回答:10

我使用 .htaccess 将所有流量路由到单个 index.php 文件。下面的代码用于引导流量,但由于某种原因它无法与后退按钮一起使用。我不知道该怎么做才能让后退按钮正常工作。我尝试了各种各样的方法,并用谷歌搜索了很多,但没有一个起作用,所以我希望这里有人可以提供帮助!

<?php
   if(isset($_GET['parameters'])) {
      if($_GET['parameters'] == "repair")
         include 'repair.html';
      else if($_GET['parameters'] == "training")
         include 'training.html';
      else if($_GET['parameters'] == "products")
         include 'products.html';
      else if($_GET['parameters'] == "about")
         include 'about.html';
      else if($_GET['parameters'] == "employees")
         include 'employees.html';
      else if($_GET['parameters'] == "training")
         include 'training.html';
      else if($_GET['parameters'] == "newaccount")
         include 'newaccount.html';
      else if($_GET['parameters'] == "contact")
         include 'contact.html';
      else if($_GET['parameters'] == "recommended")
         include 'recommended.html';
      else if($_GET['parameters'] == "careers")
         include 'careers.html';
      else
         include 'home.html';
   }
   else
      include 'home.html';
?>

到目前为止我已经尝试过但未能使用:

window.onbeforeunload
body onunload=""

一定有办法

onunload=location.reload()
之类的!无论如何必须知道语法!!

javascript php jquery ajax .htaccess
10个回答
44
投票

试试这个...未经测试。我希望它对你有用。

创建一个新的 php 文件。您可以使用后退和前进按钮,页面上的数字/时间戳始终更新。

<?php
header("Cache-Control: no-store, must-revalidate, max-age=0");
header("Pragma: no-cache");
header("Expires: Sat, 26 Jul 1997 05:00:00 GMT");
echo time();
?>
<a href="http://google.com">aaaaaaaaaaaaa</a>

或者

找到了另一个解决方案

当用户点击后退按钮时,应该触发 onload 事件。不是通过 JavaScript 创建的元素将保留其值。我建议在设置为 display:none 的 INPUT TYPE="hidden" 中保留动态创建的元素中使用的数据的备份,然后使用输入的值将动态元素重建为原来的样子。

<input type="hidden" id="refreshed" value="no">
<script type="text/javascript">
onload=function(){
var e=document.getElementById("refreshed");
if(e.value=="no")e.value="yes";
else{e.value="no";location.reload();}
}

35
投票

最新的解决方案是使用 PerformanceNavigation 界面

if(!!window.performance && window.performance.navigation.type === 2) {
    console.log('Reloading');
    window.location.reload();
}

其中值 2 表示“通过导航到历史记录来访问该页面”。

在此处查看浏览器支持: http://caniuse.com/#search=Navigation%20Timing%20API

通过浏览器后退按钮访问时重新加载网站


17
投票

隐藏的输入解决方案在 Safari 中对我不起作用。下面的解决方案有效,来自here

window.onpageshow = function(event) {
if (event.persisted) {
    window.location.reload() 
}
};

12
投票

我找到了两种方法来处理这个问题。选择最适合您的情况。 在 Firefox 53 和 Safari 10.1 上测试的解决方案

  1. 检测用户是否使用后退/前进按钮,然后重新加载整个页面

    if (!!window.performance && window.performance.navigation.type === 2) {
        // value 2 means "The page was accessed by navigating into the history"
        console.log('Reloading');
        window.location.reload(); // reload whole page
    }
    
  2. 如果页面已缓存,则重新加载整个页面。

    window.onpageshow = function (event) {
        if (event.persisted) {
            window.location.reload();
        }
    };
    

8
投票

这里发布了这个简单的解决方案在后退按钮上强制刷新页面有效...

我尝试在用户单击后退按钮时强制浏览器再次下载页面,但没有任何效果。我认为现代浏览器有单独的页面缓存,它存储页面的完整状态(包括 JavaScript 生成的 DOM 元素),因此当用户按下后退按钮时,上一页会立即以用户离开的状态显示。如果您想强制浏览器在后退按钮上重新加载页面,请将 onunload="" 添加到 (X)HTML 正文元素:

<body onunload="">

这会禁用特殊缓存并在用户按下时强制页面重新加载 返回键。使用前请三思。需要这样的事实 解决方案暗示您的网站导航概念有缺陷。


2
投票

你尝试过这样的事情吗?未测试...

$(document).ready(function(){
    $('.ajaxAnchor').on('click', function (event){ 
        event.preventDefault(); 
        var url = $(this).attr('href');
        $.get(url, function(data) {
            $('section.center').html(data);
            var shortened = url.substring(0,url.length - 5);
            window.location.hash = shortened;
        });
    });
});

2
投票

您可以使用以下方法通过单击后退按钮来刷新页面:

window.addEventListener('popstate', () => {
  location.reload();
}, false);

1
投票

首先在代码中插入字段:

<input id="reloadValue" type="hidden" name="reloadValue" value="" />

然后运行 jQuery:

<script type="text/javascript">
   jQuery(document).ready(function()
    {
            var d = new Date();
            d = d.getTime();
            if (jQuery('#reloadValue').val().length === 0)
            {
                    jQuery('#reloadValue').val(d);
                    jQuery('body').show();
            }
            else
            {
                    jQuery('#reloadValue').val('');
                    location.reload();
            }
    });


0
投票

当调用后退按钮事件(它覆盖)时,我们重定向到历史当前页面:

<script>
    window.onbeforeunload = function() { redirect(window.history.back(1)); };
</script>

-5
投票

咳咳u_u

正如我所说,后退按钮对于我们每个人来说在某些地方都是一种痛苦......也就是说......

只要你正常加载页面就会带来很多麻烦......对于一个标准的“网站”它不会改变那么多......但是我认为你可以做这样的事情

用户每次访问您的页面 .php 时都会选择要加载的内容。您可以尝试使用缓存(不缓存页面)进行一些操作,也许还有过期日期。

但长期解决方案将在“onload”事件上放置代码以通过 Ajax 获取数据,这样您就可以(使用 Javascript)运行您想要的代码,例如刷新页面。

© www.soinside.com 2019 - 2024. All rights reserved.