使用未保存的更改从页面导航时警告用户

Question

我正在创建一个ASP.NET网站,我想实现逻辑,以便在用户离开他们编辑过的页面时发出警告.

我在网上发现了很多信息,虽然大部分内容似乎已经过时了.请注意,我仍然需要了解很多关于jQuery的知识.

以下代码按预期显示消息.

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

但是,以下代码 - 只有在进行更改时才应该等于上面的代码 - 不起作用.没有显示任何警告.

$('input').change(function () {
    window.onbeforeunload = function () { return "Your changes have not been saved?" };
});

有人可以说为什么第二个片段不起作用？或许你可以指点我最近的参考.

Answer 1

执行代码时,您的输入元素可能不存在.尝试使用该.live函数检测所有输入元素的更改,或将代码包装在$(document).ready()处理程序中.

例:

$('input').live("change", function () {
    window.onbeforeunload = function () { return "Your changes have not been saved?" };
});

要么

$(document).ready(function () {
   $('input').change(function () {
      window.onbeforeunload = function () { return "Your changes have not been saved?" };
  });
});