如何获取使用Document.execCommand（）执行的命令列表

Question

我正在使用Document.execCommand()来操纵<div contentEditable = true id="#TextEditor">的内容。

通过单击按钮，我可以对我的文本编辑器启用粗体。我用它来实现大胆的代码是<button id="#ApplyBold">B</button>

$('#ApplyBold').click(function() { 
    $('#TextEditor').focus(); 
    document.execCommand('bold', false, null); 
}); 

这使得大胆启用对文本编辑器。同样，我有斜体和下划线按钮。

现在，我该如何检测由document.execCommand()命令启用的样式。 例如，如果我已启用粗体和斜体，我需要一个函数，如GetAppliedStyles()，它可以返回由document.execCommand()命令启用的应用样式。在这种情况下，他们是大胆和强调。

function GetAppliedStyles() 
{ 
    var styles = new Array(); 
    styles = document.execCommand().aCommandName; //which returns list of styles applies 
    return styles; 
} 

Answer 1

它不符合你的想法。 execCommand('bold')是一个事件，而不是一个持续的“效果”，你可以看的 - 它增加了一个<b>或<strong>标签在当前光标所在位置的CONTENTEDITABLE节点..

如果您需要在编辑过程中，检查当前的造型，您需要找到当前插入位置（Get caret position in contentEditable div），然后从DOM中向上查找该位置当前包裹的标签（例如，.closest('b')）。