CKEditor автоматически раскроет двойную ул - PullRequest
0 голосов
/ 07 мая 2019

Я написал плагин для CKEditor 4, который использует виджет и диалог.Мой виджет, немного упрощенный, состоит из div с вложенным ul и числом li.По какой-то причине, когда я переключаюсь из режима WYSIWYG в режим SOURCE, ul превращается в двойное вложенное ul.

. Я определил, какие элементы в виджете должны редактироваться, и я определил, какиеэлементы должны быть разрешены для этих редактируемых объектов.

Моя исходная структура в режиме WYSIWYG (после закрытия диалогового окна и создания виджета) выглядит следующим образом:

<div class="mycustombox">
  <div class="conditions-box">
    <div class="conditions-services">
      <span class="rwd-line-title">TITLE FOR THE UNORDERED LIST</span>
      <ul class="services-list">
        <li>an example list item</li>
        <li>another example list item</li>
      </ul>
    </div>
  </div>
</div>

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

<div class="mycustombox">
  <div class="conditions-box">
    <div class="conditions-services">
      <span class="rwd-line-title">TITLE FOR THE UNORDERED LIST</span>
      <ul class="services-list">
        <ul>
          <li>an example list item</li>
          <li>another example list item</li>
        </ul>
      </ul>
    </div>
  </div>
</div>

Оригинал ul с классом, который я дал, находится там, но есть дополнительный вложенный ul, обертывающий lielements.

Я определил содержимое моего разрешенного виджета в plugin.js :

allowedContent: 'div(!mycustombox); div(!conditions-box); div(!conditions-services); span(!rwd-line); span(!rwd-line-title); ul(!services-list); li; p; div',
requiredContent: 'div(mycustombox)',
upcast: function( element ) {
    return element.name == 'div' && element.hasClass( 'mycustombox' );
},

И я определил элемент ul как редактируемый, например:

editables: {
  priceincludes: {
    selector: 'div.conditions-box div.conditions-services ul',
    allowedContent: 'li em strong'
  },
}

Я также разрешил редактировать ul общим экземпляром CKEditor следующим образом:

CKEDITOR.dtd.$editable[ 'ul' ] = 1;

Есть ли какие-либо настройки в конфигурации CKEditor, которые могут вызывать такое поведение?

1 Ответ

0 голосов
/ 07 мая 2019

Ну, я не знаю, является ли это лучшим решением, но оно работает.Скажите CKEDitor прекратить попытки автоматически обернуть элементы li тегом ul.По какой-то причине он обращается с ними так, как будто они уже не заключены в тег ul.Использование этого в начале моего plugin.js решает проблему:

    delete CKEDITOR.dtd.$listItem['li'];
    delete CKEDITOR.dtd.$intermediate['li'];    

Я получил идею отсюда: http://margotskapacs.com/2014/11/ckeditor-stop-altering-elements/

Кажется хакомменя, но пока я не найду лучшее решение, я просто буду использовать это.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...