Question

我正在创建一个嵌入了TinyMCE编辑器的应用程序。我希望我的应用程序的控件在tinyMCE编辑器中的选择发生变化时更新，因此字体，大小和颜色菜单显示选择的字体，大小和颜色。字体和颜色工作正常，但我无法弄清楚如何获得颜色。这是我正在使用的代码：

myTinyMCESettings.handle_node_change_callback = function(editor_id,node,undo_index,undo_levels,visual_aid,any_selection){
    var editor = tinyMCE.get(editor_id);
    selectionChanged(editor,!any_selection);
};

tinyMCE.init(myTinyMCESettings);

function selectionChanged(ed,selection){    
    var fontName = ed.queryCommandValue('FontName');
    var size = parseInt(ed.queryCommandValue('FontSize'));
    var color = ed.queryCommandValue('ForeColor');
}

但是color === false。如何在tinyMCE中的插入点处获取所选文本的前景色或文本？

编辑：在tiny_mce_prototype_src.js的第12377行进一步跟踪此问题，我看到了：

// Registred commands
o = t.editorCommands.queryCommandValue(c);

当我在调试器中完成此操作时，t.editorCommands.queryCommandValue(c);将返回false。

Answer 1

我会尝试以另一种方式（不检查） - 采用计算机样式：

myTinyMCESettings.handle_node_change_callback = function(editor_id,node,undo_index,undo_levels,visual_aid,any_selection){
    var editor = tinyMCE.get(editor_id);
    var color =  tinyMCE.DOM.getStyle(node, 'color', true); // computes current color
    selectionChanged(editor,!any_selection);
};

Answer 2

我不知道你是否解决了这个问题，但我所做的是：

var node = ed.selection.getNode();
node_array = tinyMCE.DOM.getParents(node);
for(i = 0; i < node_array.length; i++){
    var the_node = node_array[i];
    var color = the_node.style.color;
    if(color != "" && color != "undefined" && color != null){
        return color;   
    }
}
return "";

其中ed是tinyMCE编辑器的变量。

Answer 3

如果您的选择完全在彩色文本中

，这将有效

tinymce.get('my_editor_id').selection.getNode().style.color;

Answer 4

这样做

tinymce.get('my_editor_id').getContentAreaContainer().style.color= "red"

如何在TinyMCE中获得选择的颜色？

4 个答案: