我可以使用 javascript 停止元刷新吗？答案

【问题标题】：Can I stop a meta refresh using javascript?我可以使用 javascript 停止元刷新吗？
【发布时间】：2015-04-10 17:35:19
【问题描述】：

以下代码允许用户阻止元刷新发生 - 它成功地从页面中删除了meta refresh，但浏览器仍然刷新了页面。知道如何使它工作吗？

<!doctype html>
<html>
<head>
<title>Test</title>
<meta charset="UTF-8" />
<meta http-equiv="refresh" content="5" id="refresh" />
<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
<script type="text/javascript">
$(function(){
  $("a").click(function(e){
    e.preventDefault();
    $("#refresh").remove();
  });
});
</script>
</head>
<body>

Reloaded at <span id="time"></span>
<script>
document.getElementById("time").innerHTML = Date();
</script> 

<a href="#">Stop refresh</a>


</body>
</html>

编辑：这与 this question 不同，因为该问题希望为不支持 javascript 的用户提供后备解决方案 - 我不是这种情况（该问题的大多数答案都不适用于该问题）。

【问题讨论】：

你不能，元标记已在页面加载时被解析，之后任何更改都会被忽略。
我没有回答你的问题，但我可以问一下为什么首先使用元刷新？
旁白：w3.org/TR/WCAG10-CORE-TECHS/#auto-page-refresh
我找到了棘手的答案：stackoverflow.com/a/13656851/2818869
that question 的一些答案似乎只是“阻止元刷新发生”，甚至问题也不符合您的情况。

标签： javascript meta-tags

【解决方案1】：

这对我来说太棒了！（在 chrome 中试过）

<button onclick="pauseshow()"><img id="myImg" src="images/pause.jpg" width="45" height="45" style="position:absolute; top:10px; left:1200px;" ></button>
function pauseshow()
{
    window.stop();
    //  Below did not work --> 
    //  var mr = document.getElementById("mymetatag");
    //  mr.parentNode.removeChild(mr);

}

【讨论】：

【解决方案2】：

只是为了完整性而不是我推荐的方式。您可以致电：

window.stop();

停止加载窗口。 Internet Explorer 不支持此功能，您必须这样做：

document.execCommand("Stop");

【讨论】：

出于调试目的，这对我来说非常有用。谢谢！

【解决方案3】：

您以后无法通过 javascript 删除标头，因为在加载页面时会触发重新加载。但推迟了 5 秒。

相反，您可以改变思维方式并使用 javascript 而不是元标记重新加载页面：

<!doctype html>
<html>
<head>
<title>Test</title>
<meta charset="UTF-8" />
<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
<script type="text/javascript">
var timer = setTimeout(function() {
  window.location = window.location;
}, 5000);
$(function(){
  $("a").click(function(e){
    e.preventDefault();
    clearTimeout(timer);
  });
});
</script>
</head>
<body>

Reloaded at <span id="time"></span>
<script>
document.getElementById("time").innerHTML = Date();
</script> 

<a href="#">Stop refresh</a>


</body>
</html>

【讨论】：

【解决方案4】：

我认为您无法执行此操作，因为在加载页面时会读取标题并且浏览器会安排刷新。我不认为浏览器给你一种方法来取消它，因为它实际上是一个 HTTP 标头，而不是文档的一部分。最好为 body 元素添加一个 onload 处理程序，该处理程序使用计时器来安排刷新，然后让您的点击处理程序取消计时器。

<script type="text/javascript">
$(function(){
  var timer;

  $('body').on('load', function() {
      timer = setTimeout(refresh, 5000);
  });

  $("a").click(function(e){
    e.preventDefault();
    if (timer) {
       clearTimeout(timer);
       timer = null;
    }
  });

  function refresh() {
      timer = null;
      document.location.reload(true);
  }
});
</script>

【讨论】：

我将var timer 放在$(function(){ 外面，并删除了$('body').on('load', function() {});。然后很好！