一个页面多个编辑器

wangEditor 支持一个页面创建多个编辑器。

  1. <head>
  2. <style type="text/css">
  3. .toolbar {
  4. background-color: #f1f1f1;
  5. border: 1px solid #ccc;
  6. }
  7. .text {
  8. border: 1px solid #ccc;
  9. height: 200px;
  10. }
  11. </style>
  12. </head>
  13. <body>
  14. <div id="div1" class="toolbar">
  15. </div>
  16. <div style="padding: 5px 0; color: #ccc">中间隔离带</div>
  17. <div id="div2" class="text">
  18. <p>第一个 demo(菜单和编辑器区域分开)</p>
  19. </div>
  20. <div id="div3">
  21. <p>第二个 demo(常规)</p>
  22. </div>
  23. <!-- 引入 wangEditor.min.js -->
  24. <script type="text/javascript">
  25. const E = window.wangEditor
  26. const editor1 = new E('#div1', '#div2')
  27. editor1.create()
  28. const editor2 = new E('#div3')
  29. editor2.create()
  30. </script>
  31. </body>