Javascript 自定义颜色选择器TinyMCE
我正在使用TinyMCE为我的站点上的WYSIWYG编辑器添加一个自定义颜色选择器,除了使用forecolor的现有颜色选择器之外。我发现了这个,并用它来让按钮显示,但有两个问题。我需要过滤显示在该按钮中的颜色(仅显示两种颜色),当您单击该颜色时,它不会更改编辑器中的字体颜色Javascript 自定义颜色选择器TinyMCE,javascript,tinymce,wysiwyg,color-picker,Javascript,Tinymce,Wysiwyg,Color Picker,我正在使用TinyMCE为我的站点上的WYSIWYG编辑器添加一个自定义颜色选择器,除了使用forecolor的现有颜色选择器之外。我发现了这个,并用它来让按钮显示,但有两个问题。我需要过滤显示在该按钮中的颜色(仅显示两种颜色),当您单击该颜色时,它不会更改编辑器中的字体颜色 tinymce.create('tinymce.plugins.ExamplePlugin', { createControl: function(n, cm) { swi
tinymce.create('tinymce.plugins.ExamplePlugin', {
createControl: function(n, cm)
{
switch(n)
{
case "universityColors":
var o = {};
ed=tinyMCE.activeEditor;
o.scriptURL = ed.baseURI.getURI();
o['class'] = 'mce_forecolor';
o.title='University Font Colors';
o.scope=this;
o.image = '../images/uor.ico',
o.onclick = function (color) { console.log('clicked',color);/*this.cs.showMenu(); if (this.o.onClick) this.o.onClick(c);*/};
o.onselect = function (color) {console.log('selected',color); /*this.color=this.o.color=c; if (this.o.onSelect) this.o.onSelect(c);*/};
var mcsb = cm.createColorSplitButton('universityColors', o);
// return the new ColorSplitButton instance
return mcsb;
}
return null;
}
});
tinymce.PluginManager.add('universityColorPicker', tinymce.plugins.ExamplePlugin);
tinyMCE.init({
mode: "specific_textareas",
editor_selector: "tinyMCE",
theme : "advanced",
plugins : "emotions,spellchecker,advhr,insertdatetime,preview, -universityColorPicker",
// Theme options - button# indicated the row# only
theme_advanced_buttons1 : "newdocument,|,bold,italic,underline,|,justifyleft,justifycenter,justifyright,fontselect,fontsizeselect,formatselect",
theme_advanced_buttons2 : "cut,copy,paste,|,bullist,numlist,|,outdent,indent,|,undo,redo,|,link,unlink,anchor,image,|,code,preview,|,forecolor,backcolor, universityColors",
theme_advanced_buttons3 : "insertdate,inserttime,|,spellchecker,advhr,,removeformat,|,sub,sup,|,charmap,emotions",
theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "left",
theme_advanced_statusbar_location : "bottom",
theme_advanced_resizing : true,
});
我也在做了一把小提琴:我做了那把老小提琴:)
这是您的修改小提琴,限制了颜色:
将字体应用于内容是另一回事。
更新:字体现在开始应用:Aweasome Thariama。工作完美。有没有办法使标准颜色选择器具有默认颜色,而新颜色选择器仅具有我们正在寻找的特定颜色?当然,您需要做的就是定义自己的颜色集在init中定义它,然后在editor.getParam('my_own_color_set')中使用它下面是我关于如何创建颜色集的问题的链接。如果你有机会,任何帮助都将不胜感激:不管怎样,在阅读了你给我的代码之后,我能够找出需要做什么。请把你的答案贴在我的另一个问题上,这样我可以给你另一个+1