javascript - webkit stylewithcss contenteditable 不起作用？

Question

我正在尝试使用 contenteditable 和 styleWithCss。

它似乎在 webkit 中不起作用。

每当我使用执行命令时，它都会生成一个<b>而不是我预期的跨度。

这是一个演示：http: //jsbin.com/izomo/2/edit

选择部分文本，单击粗体按钮，然后查看 html 输出。

这是一个错误还是我做错了什么。

非常感谢你。

Answer 1

我无法让它与这里的两个答案中的命令一起使用。对于那些仍在为这个问题头疼的人来说，这是如何让它发挥作用。

我们可以将三个值传递给 execCommand

document.execCommand( command, uiElement, value ) 

由于克里斯托弗的优秀答案详细说明了“styleWithCSS”的值默认设置为false，只需尝试：

alert(document.queryCommandState("styleWithCss"));

要将其设置为 true，您需要将第三个参数“value”作为 true 传递。像这样：

document.execCommand("styleWithCSS", null, true);

这适用于 Firefox 和 Chrome

Answer 2

似乎一切都按预期工作。请参阅WebKit BugZilla 上的错误 13490 。

编辑： 2009 年 2 月 3 日，在变更集40560 中添加了对 styleWithCSS 的支持。

也就是说，似乎从那时起，无论如何，styleWithCSS总是设置为false，而在更改之前，样式命令总是与 CSS 一起应用，好像styleWithCSS存在但总是设置为true。

document.execCommand根据Mozilla 文档，我什至尝试如下重写您的行：

document.execCommand("styleWithCSS", true, null);
document.execCommand("bold", false, null);

这些修改后的命令在 Firefox 中仍然有效，但在 Chrome 5 或 Safari 5（都在 Windows 上并已安装）中无效。

因此，这似乎是一个 WebKit 错误。

Answer 3

document.execCommand("styleWithCSS", true, null);
document.execCommand("bold", false, null);