Исправить проблему с отображением SummerNote (WYSWIG) в textarea (когда установлен флажок) :)
Недавно я работал над проектом, где мне нужно отображать ‹текстовое поле› при установленном флажке. А также мне нужно использовать редактор WYSWIG.
Для WYSWIG SummerNote — один из лучших редакторов, с которыми я сталкивался. Я активно использовал его в своем предыдущем проекте.
Отображать и скрывать ‹текстовое поле›, когда кнопка отмечена, довольно просто, а повторное включение редактора летних заметок в текстовой области не является сложной задачей.
Вот его фрагмент.
Как это выглядит на веб-странице?
Затем нужно включить Summernote в вашем веб-приложении.
Добавьте «$(‘#summernote’).summernote();» к коду JavaScript, и код:
Теперь посмотрите веб-страницу
Это красиво.
Теперь, когда вы снимите флажок, в идеале ‹текстовое поле› должно исчезнуть. Давайте попробуем это.
Но это не так. Вот дракон. Summernote добавляет свои собственные элементы div, когда вы его включаете. Мы должны позаботиться об этом.
Осмотрите веб-страницу и увидите ‹div class="note-editor … …"›
Решение
- Прежде всего нам нужно изменить тег ‹textarea› на ‹div›.
- Нам нужно добавить «$(‘.note-editor’).toggle(this.checked);» к коду JavaScript.
Теперь посмотрите на html-код
И взгляните на веб-страницу
Когда флажок установлен:
Когда флажок не установлен:
Проблема исправлена. :)
Я надеюсь, что это поможет немногочисленным членам сообщества.
