自定义 onbeforeunload 对话框

Question

我有一个 onbeforeunload 事件正在运行，它会弹出一个对话框，警告用户在他们离开时对表单的未保存更改。

window.onbeforeunload = function() {
    return 'You have unsaved changes.';
};

如何自定义显示的对话框，使其更加用户友好。现在它相当笨拙：

“您确定要离开此页面吗？

您有未保存的更改。

按 OK 继续，或按 Cancel 留在当前页面。"

我注意到 Stack Overflow 有一个更简洁：“您已开始撰写或编辑帖子”，按钮显示“留在此页面上”、“离开此页面”而不是通用的“取消”和“好的”。我该怎么做？

如果解决方案需要，我正在使用 jQuery。

Answer 1

浏览器根本不允许您自定义此框。它在 SO 上看起来不同的唯一原因是因为您在访问它时使用了不同的浏览器。谷歌浏览器使用标有“留在此页面”和“离开此页面”的按钮。根据您发布的示例文本，您似乎使用 Internet Explorer 测试了您的 onbeforeunload 处理程序。