Добавление класса CSS с помощью execCommand()

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

Выше я добавляю цитату к выделенному тексту с помощью execCommand(). Еще я хочу добавить класс CSS с именем quote к тегу <blockquote, чтобы на выходе было что-то вроде <blockquote class="quote">Some text</blockquote>. Кажется, это не работает. Пожалуйста помоги.

Я использую этот вопрос в качестве руководства. Как добавить класс или id или стиль CSS в execCommand formatBlock 'p' tag?


javascript html jquery css execcommand
person vephelp    schedule 18.01.2015    source источник

Ответы (2)


arrow_upward
4
arrow_downward

Не удается воспроизвести в 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";

Может быть, это поможет, может быть, я сделал что-то по-другому :)

person undefined    schedule 18.01.2015
comment
понял дружище! Большое спасибо! - person vephelp; 18.01.2015
comment
Хотя это добавляет класс к элементу, оно не добавляет класс к HTML, который создает contenteditable. - person Steve Lloyd; 16.05.2019

arrow_upward
0
arrow_downward

вы добавляете класс не к тому элементу. Пытаться

var newEl = this.options.ownerDocument.getSelection().focusNode;
newEl.className = newEl.className + " new-para";
person Tauseef Khan    schedule 28.11.2015