Jquery：如何为 contenteditable div 创建颜色选择器？

Question

我的问题是我该怎么做，因为我正在尝试 "simple WYSIWYG editor" 并且我成功地更改了字体的大小、粗细等。但是我在选择颜色方面仍然遇到问题。我有一个 table，其中的单元格具有不同的 bgcolors。我想为 table 内的每个 td 调用 document.execCommand。我的问题是 contenteditable div 中的文本颜色没有改变。即使当我尝试添加颜色的日志记录值时，我也可以读取该值，但是当我尝试更改颜色时仍然没有任何反应。难道我做错了什么？我的一段table，还有我的代码：

<table>
    <tr>
    <td style="background-color: #ffffff"></td>
    <td style="background-color: #ffccc9"></td>
    </tr>
</table>

$("#font-menu-color td").on("click",(function(){document.execCommand('foreColor', false, $(this).css("background-color"));}));

Answer 1

这里的问题似乎是 jquery returns RGB 颜色，但 foreColor 命令需要十六进制颜色。引用自 mdn

foreColor

Changes a font color for the selection or at the insertion point. This requires a hexidecimal color value string as a value argument.

点击是mousedown+mouseup。在鼠标按下时，可编辑区域失去焦点。如果我们在 mousedown 上添加 preventDefault，可编辑区域保持焦点。

此处示例 - 此处示例 - jsfiddle。net/xpvt214o/474448

Jquery：如何为 contenteditable div 创建颜色选择器？

Jquery: How can I create color picker for contenteditable div?

javascript

jquery

color-picker

contenteditable