HTML 页面使用 wangeditor 富文本编辑器

JavaScript/前端
542
0
0
2022-04-19

在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>