提示用户使用自定义对话框尝试使用未保存的数据进行导航

Question

当用户点击其他链接进行导航而不保存所有已编辑的数据时，应该给出提示。

使用window.onbeforeunload实现其按预期工作，但我希望它是自定义提示而不是浏览器默认提示。

任何人都可以告诉你如何实施。

Answer 1

您必须创建一些html元素（显示为提示框），必须对它们进行样式设置并最终对其进行编码，以便在window.onbeforeunload上用户确认

可以在这里找到一个例子

http://www.developphp.com/view.php?tid=1386

Answer 2

您可以使用jquery自定义各种提示元素。我发现下面一个最有用。看看Alertify plugin

在将所需的css和js文件添加到项目后，可以如下轻松配置提示窗口，

// confirm dialog
alertify.confirm("Message", function (e) {
    if (e) {
        // user clicked "ok"
    } else {
        // user clicked "cancel"
    }
});