在pasteHTML无法正常工作之前的document.execCommand

时间:2013-06-05 15:53:12

标签: javascript html richtextbox execcommand

我正在开发一个富文本编辑器。这是一个ilustraste它的示例代码

http://jsfiddle.net/paulofreitas/RG3Bd/

如果document.execCommand ('bold', false, null)之前我pasteHTML插入了一些文字,那就不行了。我想发送命令'bold',然后使用pasteHTML插入一些特殊文本并使该文本变为粗体。

我使用粗体作为示例,但可以是任何execCommand。

任何帮助?

1 个答案:

答案 0 :(得分:2)

我认为你可能最好创建一个span或div并将其样式设置为粗体或任何你想要的然后插入它。浏览器差异意味着它会变得非常混乱。这是我的意思的一个例子:

http://jsfiddle.net/nsfPN/

function pasteBoldHtmlAtCaret(html) {
    pasteHtmlAtCaret('<span style="font-weight: bold;">' + html + '</span>');
}

另一种方法是选择插入的html,发送命令将其设置为粗体(如果它不是粗体),然后将光标位置设置为插入的html之后。然后你需要确保在那之后键入/插入的任何文本也不是粗体(或者如果你想要那么确保它是)。所有这些步骤都将受到不同浏览器实现的变幻莫测的影响。

修改: 如果您只需插入一些采用当前样式的文本而不需要支持某些旧版浏览器,那么您可以像这样使用insertText命令:

function pasteTextWithStyle(html) {
    if (document.queryCommandEnabled('insertText')) {
        document.execCommand('insertText', false, html);
    } else {
        // TODO: If the browser doesn't support insertText,
        // check current styles and manually apply them...
    }
}

请参阅:http://jsfiddle.net/2Ljfj/我目前无法在iPhone上对其进行测试,但至少在webkit中支持它已经有一段时间了,所以它应该可以正常工作。