layui-tinymce
Если вам нужна последняя версия tinymce, вы можете загрузить её с официального сайта и заменить каталог layui_exts/tinymce/tinymce самостоятельно.
Онлайн-демонстрация | Форум Layui | Китайская документация tinymce
2021.01.04 tinymce обновлён до 5.6.2
2020.11.06 tinymce обновлен до 5.5.1, при загрузке изображения теперь можно использовать пользовательские имена полей и одновременно загружать другие данные
2020.08.24 tinymce обновлён до 5.4.2
Способ использования можно посмотреть в официальной документации tinymce.
layui.extend({
tinymce: '{/}./tinymce/tinymce'
}).use(['tinymce'], function () {
var t = layui.tinymce
// code ...
// Здесь и далее код без специальных комментариев
// ...
})
<textarea id="edit"></textarea>
t.render({
elem: "#edit"
// Поддерживаются все настройки tinymce
},(opt, edit)=>{
// Обратный вызов после завершения загрузки, opt — это все переданные параметры
// edit — текущий экземпляр редактора, эквивалентен t.get()
});
// Способ один
t.reload({
elem:'#edit'
// Можно повторно установить все параметры, кроме elem
},(opt, edit) => {
//Обратный вызов после перезагрузки, будет передан весь набор параметров
//Перезагрузка только перерисовывает редактор, не очищает textarea
})
// Способ два
t.reload('#edit',{
// Можно повторно установить все параметры, кроме elem
},(opt, edit) => {
})
// Если на странице только один редактор, то это эквивалентно официальному tinymce.activeEditor
// Если на странице несколько редакторов, то это эквивалентно официальному tinymce.editors[id]
var edit = t.get('#edit')
// Получить HTML-содержимое редактора
edit.getContent()
// Получить текстовое содержимое редактора
edit.getContent({format:'text'})
edit.insertContent('<b>Вставить содержимое</b>')
edit.setContent('<b>Установить содержимое</b>')
// Очистить редактор, установив пустую строку
edit.setContent('')
edit.resetContent()
edit.destroy()
var settings = {
images_upload_url:'http(s)://yoursite/apipath'
// ...
}
t.render({
images_upload_url:'http(s)://yoursite/apipath'
// ...
})
// Настройки загрузки
t.render({
elem: "#edit"
,images_upload_url:'http(s)://yoursite/apipath'//Настройка интерфейса загрузки
,form:{
name:'avatar'//Имя поля для загрузки файла
,data:{ key:'value', ... } //Другие данные, которые необходимо загрузить вместе
}
});
// Если не было внесено никаких изменений,
// В layui-admin по умолчанию используется admin, а отдельно используемый стандартный ответ от сервера требует следующего формата: {"code": 0, "msg": "success", "data": "/demo/demo.jpg"},
// где code равен 0 означает успех, msg — сообщение, data — адрес загруженного изображения, возвращаемый клиенту
// Функция обратного вызова: параметр 1 — данные загружаемого файла, параметр 2 — функция обратного вызова после успешной загрузки, параметр 3 — функция обратного вызова при ошибке загрузки
t.render({
elem: "#edit"
,images_upload_handler:function(blobInfo, succFun, failFun){
// Ваш код ...
}
})
t.render({
elem: "#edit"
, height: 200
, init_instance_callback : function(ed) {
ed.on('Click', function (e) {
// Мониторинг внутренних событий редактора
});
}
});
Событие | Описание |
---|---|
Click | Срабатывает при одиночном нажатии на редактор |
DblClick | Срабатывает при двойном нажатии на редактор |
MouseDown | Срабатывает, когда в редакторе нажата кнопка мыши |
MouseUp | Срабатывает, когда кнопка мыши отпущена в редакторе |
MouseMove | Срабатывает, когда курсор перемещается в редакторе |
MouseOver | Срабатывает, когда курсор входит в редактор |
MouseOut | Срабатывает, когда курсор выходит из редактора |
MouseEnter | Срабатывает, когда курсор попадает в редактор |
MouseLeave | Срабатывает, когда курсор покидает редактор |
KeyDown | Срабатывает, когда клавиша нажата в редакторе |
KeyPress | Срабатывает, когда клавиша удерживается в редакторе |
KeyUp | Срабатывает, когда клавиша отпущена в редакторе |
ContextMenu | Срабатывает, когда вызывается контекстное меню в редакторе |
Paste | Срабатывает после вставки содержимого в редактор |
Событие | Описание |
---|---|
Init | Срабатывает во время инициализации редактора |
Focus | Срабатывает, когда редактор получает фокус |
Blur | Срабатывает, когда редактор теряет фокус |
BeforeSetContent | Срабатывает перед установкой содержимого |
SetContent | Срабатывает при установке содержимого |
GetContent | Срабатывает при получении содержимого |
PreProcess | Срабатывает при сериализации содержимого редактора |
PostProcess | Срабатывает при отправке содержимого редактора |
NodeChange | Срабатывает при изменении выделения в редакторе |
Undo | Срабатывает при восстановлении предыдущего состояния содержимого |
Redo | Срабатывает при отмене отмены действия |
Change | Срабатывает при изменении содержимого |
Dirty | Срабатывает, если содержимое считается грязным |
Remove | Срабатывает при удалении редактора |
ExecCommand | Срабатывает после выполнения команды |
Документация на китайском языке
Официальная документация (на английском языке)
В файле layui_exts\tinymce\tinymce\skins\ui\oxide\skin.min.css добавить пять нулей после всех значений z-index больше 1.
Вы можете оставить комментарий после Вход в систему
Неприемлемый контент может быть отображен здесь и не будет показан на странице. Вы можете проверить и изменить его с помощью соответствующей функции редактирования.
Если вы подтверждаете, что содержание не содержит непристойной лексики/перенаправления на рекламу/насилия/вульгарной порнографии/нарушений/пиратства/ложного/незначительного или незаконного контента, связанного с национальными законами и предписаниями, вы можете нажать «Отправить» для подачи апелляции, и мы обработаем ее как можно скорее.
Комментарии ( 0 )