HTML 頁面使用 wangeditor 富文字編輯器

wubuze發表於2021-06-02

在laraveL blade檢視頁面也適用
編輯器官方文件:
www.wangeditor.com/doc/pages/02-%E...


<script src="https://cdn.jsdelivr.net/npm/wangeditor@latest/dist/wangEditor.min.js"></script>

// 工具欄 (不需要可以隱藏)
<div id="toolbar-container" class="toolbar" hidden></div>

// 文字域
<div id="text-container" class="text"></div>
<script>

  const E = window.wangEditor
  const editor = new E('#toolbar-container', '#text-container') // 傳入兩個元素
  editor.create()

  // 設定預設
  var def = $("#supplier_tpl").val()
  editor.txt.html(def)
  // 設定文字框不可編輯
 editor.$textElem.attr('contenteditable', false)


 // 更改
 $.get('',function() {
     editor.txt.html(result.supplier_tpl) // 重新設定編輯器內容
 })


</script>
本作品採用《CC 協議》,轉載必須註明作者和本文連結

相關文章