Невозможно настроить редактор кендо, примененный к элементу div без панели инструментов

Question

Я применил редактор кендо к элементу div, а не с использованием textarea, поскольку это вызывает некоторые проблемы в iPad. Теперь я не хочу, чтобы редактор имел панель инструментов для форматирования текста.

Я попытался применить стили как нет и установить инструменты для пустого массива, но панель инструментов все еще отображается с перетаскиваемой кнопкой.

<div id="targetdiv" contenteditable="true" style = "resize: none;width: 
  100% 
!important; height:150px; max-height:150px;max-width: 100% !important;">
</div>

<script>
$("#targetdiv").kendoEditor({
    tools: []});
</script>

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

Подход 1: (не работает)

<style>
.k-editor-toolbar
{
   display:none;
}
</style>

Подход 2: (не работает)

$('.k-editor-toolbar').hide();

Подход 3: (частично работает)

Добавлено событие выбора, но панель инструментов по-прежнему отображаетсяна мгновение, а затем исчезает.

 $("#targetdiv").kendoEditor({
    tools: [],
    //Fires when the Editor selection has changed.
    select: function (e) {
        let editor = $("#targetdiv").data("kendoEditor");
        editor.toolbar.hide();
    });

Answer 1

Наконец,

Я должен подписаться на событие открытия панели инструментов редактора и предотвратить его выполнение. Это решило мою проблему.

let editor = $("#targetdiv").getKendoEditor();
editor.toolbar.window.bind("open", function (e) {
    e.preventDefault();
});

Answer 2

Если вы не хотите показывать панель инструментов, определите пустые инструменты в инициализации редактора KendoUI:

$("#editor").kendoEditor({
// Empty tools so do not display toolbar
tools: [ ]
});

Если вы хотите отключить издание, вы должны использовать:

$(editor.body).attr('contenteditable',false);

Вы также можете попробовать это

.k-editor-toolbar
{display:none !important;}