jQuery UI 对话框 OnBeforeUnload

Question

我有一个小问题。我试图捕捉窗口的 OnUnLoad 事件并询问确认问题，如果用户决定他们想要留下那么很好，如果他们想要离开页面，那么他们将丢失所有未保存的数据。这是问题...

我正在使用 jQuery UI 对话框，当我将以下代码放在我的页面上时，我打开了对话框，当我单击浏览器上的后退按钮时，它永远不会弹出 msgbox。它只是刷新页面：

<script type="text/javascript"> 
    $(window).bind('beforeunload', function() { 
            alert('you are an idiot!'); 
        } 
    );
</script>

我使用的解决方案是一个帖子here。同样，如果我没有打开 jQuery UI 对话框，msgbox 将正常显示。如果我这样做了，那么它不会显示 msgbox，只会刷新页面。

有什么想法吗？

Answer 1

对于 ASP.NET MVC，如果您想通过提交特定表单离开页面例外：

设置表单ID：

@using (Html.BeginForm("Create", "MgtJob", FormMethod.Post, new { id = "createjob" }))
{
  // Your code
}



<script type="text/javascript">

  // Without submit form
   $(window).bind('beforeunload', function () {
        if ($('input').val() !== '') {
            return "It looks like you have input you haven't submitted."
        }
    });

    // this will call before submit; and it will unbind beforeunload
    $(function () {
        $("#createjob").submit(function (event) {
            $(window).unbind("beforeunload");
        });
    });

</script>

Answer 2

这对我有用：

window.addEventListener("beforeunload", function(event) {
  event.returnValue = "You may have unsaved Data";
});

Answer 3

显示警报的正确方法是简单地返回一个字符串。不要自己调用alert() 方法。

<script type="text/javascript">
    $(window).on('beforeunload', function() {
        if (iWantTo) {
            return 'you are an idiot!';
        }
    }); 
</script>

另请参阅：https://developer.mozilla.org/en-US/docs/Web/Events/beforeunload

Answer 4

这对我有用

$(window).bind('beforeunload', function() {
      return 'Do you really want to leave?' ;
});

Answer 5

您还可以通过提交特定表单来例外离开页面：

$(window).bind('beforeunload', function(){
    return "Do you really want to leave now?";
});

$("#form_id").submit(function(){
    $(window).unbind("beforeunload");
});

Answer 6

jQuery API 明确表示不要绑定到 beforeunload，而应该直接绑定到 window.onbeforeunload，我只是遇到了一个非常糟糕的内存，部分原因是使用 jQuery 绑定到 beforeunload。