使用 JQuery DirtyForms 插件的示例

Question

我正在使用jQuery DirtyForms插件来防止用户无意中离开页面而不保存。 我在使用对话框时遇到了一些麻烦。 我有两个按钮："取消"和"不保存"。

"取消"操作工作正常：对话框关闭，但未加载新页面。 但是，"不保存"操作不起作用。 应该加载新页面，但它没有发生。

我一定错过了一些明显的东西。 谁能看出我做错了什么？

<script type="text/javascript">
    $(document).ready(function(){
            $('form').dirtyForms();
    });
    $('a').click(function(event){
            event.preventDefault();
            var targetUrl = $(this).attr("href");
            if($.DirtyForms.isDirty()){
                    $("#dialog-savechanges").dialog({
                            height: 250,
                            width: 500,
                            modal: true,
                            buttons: {
                                    Cancel: function() {
                                            $( this ).dialog( "close" );
                                            $.DirtyForms.choiceContinue = false;
                                            $.DirtyForms.choiceCommit(event);
                                    },
                                    "Don't Save": function() {
                                            $( this ).dialog( "close" );
                                            $.DirtyForms.choiceContinue = true;
                                            $.DirtyForms.choiceCommit(event);
                                    }
                            }
                    });
            }
    });
</script>
<div id="dialog-savechanges" title="Save Changes?">
    <p>You've made changes to this page. Do you want to leave this page without saving?</p>
</div>

谢谢！

-史蒂夫

Answer 1

好吧，我知道这是显而易见的事情...希望这会帮助其他人。

问题是预防默认函数：

event.preventDefault();

删除此选项后，对话框将按预期运行。