如何在PHP中创建一个警示框，当浏览器的刷新或后退按钮被点击时？

Question

如何在PHP中创建一个警示框，当浏览器的刷新或后退按钮被点击时？

3

这可能是一个重复的问题，但有一件事我需要知道，我在其他任何问题中都找不到答案。

当浏览器的刷新或后退按钮被点击时，如何弹出警告框，但不是其他按钮，如主页等，它们将页面重定向到另一个页面？

我使用以下代码制作了一个警告框：

<script type="text/javascript">
    window.onbeforeunload = function() {
        return 'If you resubmit this page, progress will be lost.';
    };
</script>

但是当我点击我的主页按钮时，它会加载到另一个页面，警告框仍然触发。我只需要浏览器的刷新和后退按钮才需要警告框。

非常感谢任何帮助。提前致谢。 :)

更新

这是在jsfiddle.net上运行正常但在我的浏览器中无法工作的代码。

<html>
<head>
<script>
    var btn = document.getElementById('homepage'),
    clicked = false;

    btn.addEventListener('click', function () {
    clicked = true;
    });

    window.onbeforeunload = function () {
    if(!clicked) {
    return 'If you resubmit this page, progress will be lost.';
    }
    };
</script>
</head>

<body>
    <form method="post" action="something.php" name="myForm">
        <input type="submit" name="homepage" value="Please Work" id="homepage" href="something.php">
    </form>
</body>
</html>

现在我的问题是为什么它在我的浏览器中无法工作，但在jsfiddle.net上可以？有什么我错过的东西吗？需要进行配置等操作吗？谢谢。

JSFIDDLE链接：http://jsfiddle.net/bawvu7yy/4/

- Nek

无法完成此操作，因为要确定用户是在刷新、返回还是前往其他页面，您需要知道他们试图访问的URL，而这是不可能的。https://dev59.com/NnI-5IYBdhLWcg3wwbdM - chiliNUT

1

@user4035 当在“window”中的“onbeforeunload”事件中传递一个“String”时，“return”会显示一个弹出窗口。参考：MDN window.onbeforeunload - Patrick Roberts

@PatrickRoberts 谢谢，我不知道那个。 - user4035

2个回答

0

只需在JavaScript中使用 window.onbeforeunload 函数，使用以下代码即可。

<script type="text/javascript">
     window.onbeforeunload = function() { return "Are you sure you want to leave?"; }
</script>

希望这能对你有所帮助。

- Utkarsh Dixit

这正是他已经拥有的...这并没有回答问题。 - Patrick Roberts

这将在任何按钮点击时弹出消息！ - Noam B.

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Patrick Roberts · Accepted Answer

确定导航触发的点击是仅在被点击的按钮存在于您的文档中时才可能的。假设这个“主页”按钮是所讨论的文档中的元素，也许您可以使用一个标记来跟踪是否已经点击了该按钮。

// assume that the homepage button has an id "homepage".
var btn = document.getElementById('homepage'),
    clicked = false;

btn.addEventListener('click', function () {
  clicked = true;
});

window.onbeforeunload = function () {
  if(!clicked) {
    return 'If you resubmit this page, progress will be lost.';
  }
};

这样弹出窗口只会在其他任何页面导航引起时才发生。

编辑：我在jsfiddle上提供了一个可工作的演示。该链接不会触发弹出窗口，但是行为与“后退”和“刷新”完全相同的另外两个按钮会触发弹出窗口。在this update中，clicked = true;被注释掉，这表明当未执行此操作时，Home按钮也会开始出现弹出窗口。

第二次编辑：您正在元素存在之前运行脚本。将包含JavaScript的