使用execCommand（）添加CSS类

Question

function iBlockquote(){
    rich_body_eng.document.execCommand('FormatBlock', false, "<blockquote>");
    var quote = window.getSelection().focusNode.parentNode;
    $(quote).addClass("quote");
}

上面我使用execCommand()为所选文本添加了一个块引用。我想要做的另一件事是在CSS标记中添加一个名为quote的{​​{1}}类，因此输出类似于<blockquote。它似乎不起作用。请帮忙。

我正在使用这个问题作为指导。 How to add class or id or CSS style in execCommand formatBlock 'p' tag?

Answer 1

无法在Firefox中重现，这里是JSFiddle，我尝试使用jQuery和纯JavaScript添加该类，两者都有效。

HTML

<div contentEditable="true"></div>

CSS

  

这只是为了显示blockquote。

.quote{
    width:300px;
    height:100px;
    background-color:khaki;
}

的JavaScript

document.designMode = "on";
document.execCommand('formatBlock', false, "<blockquote>");
var quote = window.getSelection().focusNode.parentNode;
$(quote).addClass("quote");
//quote.className = "quote";

也许这有帮助，也许我做了不同的事情：）

Answer 2

您将该类添加到错误的元素中。试试

var newEl = this.options.ownerDocument.getSelection().focusNode;
newEl.className = newEl.className + " new-para";