Question

我正在使用以下脚本来检查表单内容是否已更改，以防止用户在不保存更改的情况下浏览。

<script type="text/javascript">
var isDirty = false;
var msg = 'You have unsaved changes.';
$(document).ready(function(){
    $(':input').change(function(){
        if(!isDirty){
            isDirty = true;
        }
    });
    window.onbeforeunload = function(){
        if(isDirty){
            return msg;
        }
    };
});
</script>

“保存”按钮目前如下所示：

<input type="submit" name="frmProjectAction" value="Save" onclick='selectAll(frmProjectResources,true);' />

这大部分都有用，但我有两个问题：

1.即使用户单击表单上的“保存”按钮，它也会触发。我该如何防止这种情况？

2.它没有检测到我在表单上的TinyMCE文本框中的更改。如何检测TinyMCE文本框中的更改以及表单上的所有其他字段？

提前致谢 - 戴夫

Answer 1

1：在将isDirty设置为false的保存按钮上使用click（）jquery函数。您需要首先在保存按钮中添加id或类，以便可以使用jquery进行定位。假设您将保存按钮ID设置为“savebutton”，然后执行以下操作：

$('#savebutton').click(function(){
  selectAll(frmProjectResources,true); // <-- from your onclick="" attribute
  isDirty = false;
})

您可以注意到我们已将selectAll（...）部分从保存按钮的onclick属性移动到jquery。因此，您应该从按钮中删除onclick属性。

2：TinyMCE有onchange_callback你可以使用一个将isDirty设置为true的函数。初始化TinyMCE时会设置onchange_callback，并且您可以为其提供要更改表单的函数的名称。

//first define the function

function setIsDirty(){
  isDirty = true;
}

// then init the tinyMCE
tinyMCE.init({
        ... // some parameters
        onchange_callback : "setIsDirty"
});

这样，您可以准确地控制编辑器更改时发生的情况。如果您只是需要在离开页面之前检查它是否已被编辑，您也可以使用TinyMCE自己的isDirty方法

Answer 2

这实际上只是问题1的解决方案：

您需要一个额外的事件处理程序，一个用于表单上的onsubmit。

在该事件处理程序中，您将isDirty更新为false（因为您现在正在保存表单..所以它不再是“脏”）

我无法评论tinyMCE，因为我从未使用过它。

Answer 3

plugins: "autosave"
autosave_ask_before_unload: true
toolbar: "restoredraft"

isDirty检查不能按预期工作

3 个答案: