Ckeditor добавляет пустые абзацы при применении стиля

мой CKEditor добавляет много ненужных тегов при применении стиля к выбранному абзацу

я инициирую CKeditor со следующим html:

<p>
    Hi, this a text!</p>

когда я выбираю абзац и применяю стиль с помощью панели инструментов, CKEditor форматирует мой html следующим образом:

<p>
    <span style="display: none;">&nbsp;</span></p>
<p>
    <span id="cke_bm_173S" style="display: none;">&nbsp;</span>Hi, this a text!<span id="cke_bm_173E" style="display: none;">&nbsp;</span></p>
<p>
    <span style="display: none;">&nbsp;</span></p>

есть ли способ предотвратить добавление CKEditor абзацев с неразрывным пространством?

вещи, которые я уже пытался добавить config.fillEmptyBlocks = false; и config.IgnoreEmptyParagraphValue = true; в мой конфигурационный файл

обновление Оказывается, эта проблема была вызвана самим стилем, который был пользовательским определенным стилем. Эта часть кода была проблемой:{name : 'Heading1', element : 'p class= "subheadingsecondlevel"}, как только я изменил его на:{name : 'Heading1', element : 'p', attributes : {class : 'subheadingsecondlevel'} }

7
ckeditor javascript

2 ответов

вы можете рассмотреть следующие:

config.enterMode = CKEDITOR.ENTER_BR;
config.autoParagraph = false;

вы можете проверить мой пост здесь для получения дополнительной информации:
как настроить ckeditor, чтобы не переносить содержимое в блок

?

следующий параметр конфигурации не позволит редактору вставлять неразрывное пространство в пустые абзацы:

  config.fillEmptyBlocks = false;


Был ли весь дополнительный код вставлен после применения только одного стиля?
Какой стиль вы применили, весь дополнительный код вставлен независимо от стиля, который вы используете?
Что произойдет, если выбрать текст и нажать кнопку полужирным шрифтом?
Код, который вы показываете, копируется из исходного представления редактора или с последней страницы, используемой для отображения содержимого?

Хорошо,
Джо!--3-->

8

или, если все не удается, вы можете использовать псевдо-класс селектора CSS': empty' и дать ему "display: none". На практике вы добавляете эту строку в свой CSS:

p:empty {
  display:none
}

Я понимаю, что это грязное решение, но оно отлично работает в большинстве случаев и имеет минимальный эффект от дизайна и функциональности.

2