javascript向ckeditor5中插入附件
阿新 • • 發佈:2018-09-07
javascrip img html ESS bold err htm tom pro
ckeditor5相關的東西中文的太少了,今天實現了自定義添加內容功能在此記錄一下,希望能幫到需要的朋友
<div name="content" id="editor">
<p>歡迎訪問</p>
</div>
<button id="insert-text" class="btn btn-light">添加圖片</button>
$(function () { ClassicEditor.create(document.querySelector('#editor'), { //language: 'zh-cn', toolbar: ['heading', '|', 'bold', 'italic', 'link', 'blockQuote', 'bulletedList', 'numberedList' ] }).then(editor => { console.log(editor) window.editor = editor; }) .catch(error => { console.log(error); }); console.log(editor) $('#insert-text').on('click', function () { var obj = document.createElement('img') // 添加的內容可以自定義, 這裏以添加圖片為例 obj.setAttribute('src', 'image.jpg' ) const viewFragment = editor.data.processor.toView(obj.outerHTML); const modelFragment = editor.data.toModel(viewFragment); editor.model.insertContent(modelFragment, editor.model.document.selection); }) })
javascript向ckeditor5中插入附件