多个TinyMCE编辑器,但只有一个工具栏？

Question

我环顾了论坛,但似乎无法找到这个问题的明确答案......

我在我们的网站上使用jQuery和TinyMCE.我已经阅读了TinyMCE的文档,但我还是迷路了.我们正在做一个界面,需要在页面的多个位置进行就地编辑.唯一的问题是,每个都将在顶部的一个工具栏中提供TinyMCE的所有编辑选择.因此,回顾一下,它是多个编辑器(每个编辑器都没有自己的工具栏,只是编辑或选择文本的位置),页面顶部只有一个工具栏来控制当时活动的文本框.

怎么能实现这一目标？它甚至可能吗？任何帮助,任何正确方向的推动,任何关于这个问题的提示/技巧/知识将是一个伟大的,伟大的帮助.

谢谢,詹姆斯

Answer 1

我知道有一种方法可以在文本区域聚焦时显示工具栏，然后在文本区域模糊事件上隐藏 - 所以这可能是一条路线。

我做了类似的事情（使用多个文本区域），在其中按需加载tinyMCE，所以像按需加载然后在完成（模糊事件）时销毁之类的东西可能就是您所追求的。

我无法向您提供我的所有代码，因为它实际上是我雇主 IP 的一部分，但这里有一个粗略的概述，希望对您有所帮助。tinyMCE_GZ 是 gzip 的一部分，位于tinyMCE 站点之外。

isTinyMCE_Loaded = false;

jQuery('.my-textarea').one("click", function(){
    BuildWYSIWYG.Full(jQuery(this));
})

BuildWYSIWYG.OnDemand: function(callback){
    tinyMCE_GZ.init({
        plugins : 'style,table,advhr,advimage,advlink,insertdatetime,preview,searchreplace,contextmenu,paste,fullscreen,visualchars,nonbreaking,xhtmlxtras,safari,tinybrowser',
        themes : 'simple,advanced',
        languages : 'en',
        disk_cache : true,
        debug : false
    }, function(){ 
        isTinyMCE_Loaded = true; 
        callback();
    });
};
BuildWYSIWYG.Full: function(el){   
    settings.elements = jQuery(el).attr("id");

    // Build advanced wysiwyg
    if (isTinyMCE_Loaded){
        tinyMCE.init(settings);
    } else {
        BuildWYSIWYG.OnDemand(function(){
            tinyMCE.init(settings);
        });
    }
}