contentEditable - execCommand 'heading‘只适用于火狐

Question

我有以下代码，它将所选文本包装在H2标记中。

问题是，它只能在Firefox中运行(尽管我还没有在IE中测试过)。它在Safari或Chrome中不起作用。

我是不是错过了什么，或者这个函数只是不能兼容所有的浏览器？

<button onclick="document.execCommand('heading',false,'h2');">heading</button>

<div class="editable" contentEditable>
    <p>Add content here...</p>
</div>

Answer 1

[注意:现在广泛支持 document.execCommand 及其功能。]

你可能已经找到了答案，但由于我遇到了同样的问题，我将发布以下内容：

它不是一个被广泛支持的功能。如下所示：http://www.quirksmode.org/dom/execCommand.html#t013

看起来你必须使用formatBlock：

document.execCommand('formatBlock', false, '<'+dataValue+'>');  //dataValue must be h2 in your case

Answer 2

要创建H2标记，您需要使用

document.execCommand('formatBlock',false,'h2')

看起来不错。