[Javascript] 仅当字段值已更改时才激活OnBeforeUnload


Answers

我们只是使用Window.onbeforeunload作为我们的“改变”标志。 以下是我们正在做的事情(使用lowpro):

Event.addBehavior({
  "input[type=radio]:change,input[type=text]:change,input[type=checkbox]:change,select:change": function(ev) {
       window.onbeforeunload = confirmLeave;
  }
  ".button.submit-button:click": function(ev) {
       window.onbeforeunload = null;
  },
});


function confirmLeave(){
    return "Changes to this form have not been saved. If you leave, your changes will be lost."  
}
Question

我试图达到的目标是,如果用户尝试关闭一个页面或者不先保存,则向未保存的更改的用户发出警告。

我已经设法让OnBeforeUnload()对话框弹出...但是如果用户没有修改任何字段值,我不希望它被显示出来。 为此,我使用这个名为is_modified的隐藏输入字段,该字段默认值为false,并在编辑任何字段时翻转为true

我尝试将更改事件绑定到此is_modified字段以尝试检测值更改...然后才激活OnBeforeUnload。

$( '#is_modified' ).change( function() {
    if( $( '#is_modified' ).val() == 'true' )
        window.onbeforeunload = function() { return "You have unsaved changes."; }
});

但是从我所看到的情况来看, change()事件只有在这3个步骤之后才起作用 - 一个字段接收焦点,一个值被改变,字段失去焦点。 在隐藏输入字段的情况下,我不知道这个接收和放松焦点部分是如何工作的! 因此,onbeforeunload函数永远不会被激活。

任何人都可以提出一个方法来维护触发器is_modified?

谢谢。




$(window).bind('beforeunload',function() {
 return "'Are you sure you want to leave the page. All data will be lost!";
});

$('#a_exit').live('click',function() {
    $(window).unbind('beforeunload');
});

上面的作品对我来说。




在IE9中,你可以使用简单的return语句(re),它不会显示任何对话框。 快乐编码