contentEditable、execCommand 和强制新键入的文本加粗答案

【问题标题】：contentEditable, execCommand, and forcing newly typed text to be boldedcontentEditable、execCommand 和强制新键入的文本加粗
【发布时间】：2011-03-21 21:09:27
【问题描述】：

我在玩 contentEditable 和 execCommand，我试图让它在按下按钮时，

如果 contentEditable 中有选中的文本，则变为粗体
如果在 contentEditable 中没有选择文本，则在按下按钮后在 contentEditable 中键入的任何文本都会加粗

我尝试使用以下 Javascript 命令：

 document.execCommand('bold', false, null);

但不幸的是，这只会使选中的文本变为粗体；如果没有选择任何文本并且您在按下按钮后开始输入，则文本显示为非粗体。

我注意到，如果我在 contentEditable 中按 Ctrl+B，它会完全按照我的意愿完成，但我想使用 Javascript 来完成此操作（并且无需在 Javascript 中模拟 Ctrl+B）。

【问题讨论】：

标签： javascript contenteditable execcommand

【解决方案1】：

实际上，document.execCommand() 调用完全符合您的要求（您可以通过从 keydown 事件处理程序调用它来证明这一点），我怀疑这是您可能用来触发命令就是问题所在。

【讨论】：

你是对的。我相信这个问题与焦点有关（我在我的应用程序中嵌入了一个浏览器控件）并且在修复它之后，新输入的文本在 document.execCommand() 调用之后确实变成了粗体。谢谢！
尝试设置下划线和斜体怎么样，然后输入一些内容并让文本使用这两种格式？

【解决方案2】：

Javascripts Range 可以检查选定的文本，请参阅this link。您可以使用它来获取选定的文本（startnode、endnode、offset 等）。如果您希望新文本为粗体，只需将其添加到新创建的 <p> 中，您在 css 中给出粗体。但是，这在 IE 中可能不起作用......

【讨论】：