Question

我使用tinymce编辑器提供丰富的文本格式，以及我想提供自动保存选项。我设法写了一个完全相同的脚本，但是有一个问题。如果窗口不是当前选项卡，我不想调用该保存功能，因此不会进行不必要的保存调用。

为了解决这个问题，我使用$(window).focus()，但这似乎不起作用，因为当tinyMCE编辑器处于焦点（意味着我正在输入它）时，窗口会失去焦点（很可能是因为tinyMCE编辑器使用iFrame）因此我没有调用我的定期更新函数。

如果编辑器有一个处理程序onFocus，我很容易解决这个问题，但似乎没有。任何人都可以建议我如何克服这个问题？我的代码如下：

/* Function to be called for saving the blog */
function saveBlog(){

    var ed = tinymce.activeEditor;
    /* Ajax call will be done only when some changes has been made in the editor*/
    if (ed.isDirty())
    {
        ed.save();
        var link = $(this).attr("href");
        var cur_elem = $(this);
        cur_elem.html('saving...');
        cur_elem.addClass('unclickable');

        $.ajax({
            type: "POST",
            url: link,
            data: $("#blog_form :input[name!='csrfmiddlewaretoken']").serialize(),
            dataType: 'json',
             success: function(){
                cur_elem.html('Save');
                cur_elem.removeClass('unclickable');
            }
        });
    }

};


var interval_id;

/* Timer resumes when the window comes back in focus */
$(window).focus(function() {
    if (!interval_id)
        interval_id = setInterval(saveBlog, 5000);
});

/* Whenever window goes out of focus the timer is cleared */
$(window).blur(function() {
    clearInterval(interval_id);
        interval_id = 0;
});

/* Starts the auto saving for the first time */
$(document).ready(function(){
     interval_id = setInterval(saveBlog, 5000);
});

任何人都可以帮助解决这个问题，我只需要知道tinyMCE编辑器实例何时处于焦点，以便我可以恢复自动保存周期功能。除了$(window).focus

之外，我还可以添加它

Answer 1

虽然这篇文章很老，但我写了一个插件，每隔x秒就将表单数据发送到指定的url。我在博客上发表了here。

简而言之，我们的想法是创建一个iframe，动态更改表单的目标和动作，并提交表单以激发ajax效果。保存后，我将表单元素置于其初始状态，这样如果用户想要手动保存，他或她就不会有任何困难。

请注意我写的插件是针对tinymce4的。对于旧版本，您必须稍微更改源代码。

Answer 2

你有没有试过onActivate - 处理程序？

使用TinyMCE编辑器时如何自动保存

2 个答案: