记一次wangEditor编辑器实现ajax修改回显功能

起初百度看了很多都没有自己需要的，所以最后去翻文档找到了，原来这么简单。。。

话不多说，上代码

官网是这么说的

设置内容
以下方式中，如果条件允许，尽量使用第一种方式，效率最高。

html 初始化内容
直接将内容写到要创建编辑器的<div>标签中
<div id="div1">
    <p>初始化的内容</p>
    <p>初始化的内容</p>
</div>

<script type="text/javascript" src="/wangEditor.min.js"></script>
<script type="text/javascript">
    var E = window.wangEditor
    var editor = new E('#div1')
    editor.create()
</script>

js 设置内容
创建编辑器之后，使用editor.txt.html(...)设置编辑器内容
<div id="div1">
</div>

<script type="text/javascript" src="/wangEditor.min.js"></script>
<script type="text/javascript">
    var E = window.wangEditor
    var editor = new E('#div1')
    editor.create()
    editor.txt.html('<p>用 JS 设置的内容</p>')
</script>

追加内容
创建编辑器之后，可使用editor.txt.append('<p>追加的内容</p>')继续追加内容。

清空内容
可使用editor.txt.clear()清空编辑器内容

这是初始wangEditor的代码，用了textarea作隐藏域

<script>
  var E = window.wangEditor;
  var editor = new E('#wang');  // 两个参数也可以传入 elem 对象，class 选择器
  editor.customConfig.debug = true;
  editor.customConfig.uploadImgServer = '/post/upload';
  editor.customConfig.uploadFileName = 'multiple';// <-   与后台获取文件名相同
  var $text11 = $('#text11')
  editor.customConfig.onchange = function (html) {
    // 监控变化，同步更新到 textarea
    $text11.val(html)

  }
  editor.create();
  // 初始化 textarea 的值
  $text11.val(editor.text.html())

</script>

ajax回显部分：结合模态框，穿了一个文章的id过来，把它查出来，

//查询
  function get(id) {
    var id = id;
    var title = $("#title").val()
    var content = $("#text11").val()

    var url="/news/editNews/"+id

    $.ajax({
      url : url,
      data : {id:id,title: title, content: content},
      type: "GET",
      async : true,
      success : function (data) {
        $("#id").val(data.id)
        $('#title1').val(data.title)
        // $("#text11").val(data.content)
        $("#pp").html(data.content)



        $('#editModal').modal.hide();
      },
      dataType : "json"
    });
  };

内容部分：

  <label for="content">内容</label>
                <div id="layout">
                  <div id="wang" name="content"  ><p id="pp"></p>

                  </div>
                  <textarea name="content"  id="text11" style="width: 100%;height: 200px;display: none"></textarea>
                </div>
              </div>

简单记录下，有问题可以留言