jquery - Froala - 如何在颜色弹出窗口中添加更多选项卡或添加自定义颜色按钮？
问题描述
如问题中所述，我试图找出是否有办法向颜色弹出窗口添加更多选项卡或添加更多自定义颜色按钮。我在一个空的 froala 元素中添加了一个输入，每当您从编辑器更改元素的颜色时，我都会修改它以更改输入的文本颜色和背景颜色，但现在我想要第三个颜色选择器来更改边框颜色。有什么办法吗？
如果有人想知道我是如何破解它的，那么这里是代码。也许我可以在那里做一些改变？
$('.froala-editor-input')
.keydown(false) // Don't let user type anything
.froalaEditor({
key: froalaKey,
toolbarInline: true,
charCounterCount: false,
toolbarVisibleWithoutSelection: true,
toolbarButtons: [
'showMoreBtn', 'bold', 'align', 'horGridAlign', 'boxShadow', 'color', 'fontSize', 'fontFamily', '-',
'radiusBtn', 'rightToLeft', 'leftToRight', 'undo', 'redo'
]
})
.on('froalaEditor.commands.after', function (e, editor, cmd, param1, param2) {
// console.log(e);
// console.log(editor, cmd, param1, param2);
if(cmd == 'textColor'){
$('.ui-selected input').css('color',param1+' !important');
// remove previous styles
$('#fr-styles').remove();
// create a new <style> element, set its ID
var $style = $('<style>').attr('id', 'fr-styles');
// create the style string: it's the text node of our <style> element
$style.text(
'::placeholder { ' +
'color: '+param1+' !important'+
'}');
// append it to the <head> of our document
$style.appendTo('head');
}
if(cmd == 'backgroundColor'){
$('.ui-selected input').css('background',param1);
}
});
HTML如下：
<div class="froala-editor-input">
<input/>
</div>