summernote

summernote是比较简洁的一款富文本框,获取值,赋值方便

    $('#summernote').summernote({
            lang : 'zh-CN',// 语言
            height : 100, // 高度
            width : '100%',
            minHeight : 300, // 最小高度
            placeholder : '请输入文章内容', // 提示
            // summernote自定义配置
            toolbar: [
      ['operate', ['undo','redo']],
      ['magic',['style']],
      ['style', ['bold', 'italic', 'underline', 'clear']],
      ['para', ['height','fontsize','ul', 'ol', 'paragraph']],
      ['font', ['strikethrough', 'superscript', 'subscript']],
      ['color', ['color']],
      ['insert',['picture','video','link','table','hr']],
      ['layout',['fullscreen','codeview']],
    ]
    回调函数
     callbacks: {
       //初始化
       onInit: function() {
         //init
       },
       onChange: function(contents, $editable) {
         //change
       }
       //焦点
       onFocus: function() {
         //focus
       },
       //图片文件上传
       onImageUpload: function(files, editor, $editable) {
         data = new FormData();
         data.append("file", files[0]);
         $.ajax({
           data : data,
           type : "POST",
           url : "",
           cache : false,
           contentType : false,
           processData : false,
           dataType : "json",
           success: function(data) {
             //[服务器所在文件所在目录位置]一般为"http://119.23.216.181/RoboBlogs/Upload_File/default_show.png"
             $('#summernote').summernote('insertImage', "[服务器所在文件所在目录位置]");
           },
           error:function(){
             alert("上传失败");
           }
         });
     }
  }
});

创建一个summernote,设置语言、高度、宽度、自定义控件等

<link rel="stylesheet" charset="utf-8" href="<%=request.getContextPath()%>/themes/static/css/font-awesome.min.css">
<link rel="stylesheet" charset="utf-8" href="<%=request.getContextPath()%>/themes/static/ajax/libs/summernote/summernote.css">
<link rel="stylesheet" charset="utf-8" href="<%=request.getContextPath()%>/themes/static/ajax/libs/summernote/summernote-bs4.css">
<link rel="stylesheet" charset="utf-8" href="<%=request.getContextPath()%>/themes/static/ajax/libs/summernote/summernote-lite.css">
<script language="javascript" charset="utf-8" src="<%=request.getContextPath()%>/themes/static/ajax/libs/summernote/summernote.js"></script>
<script language="javascript" charset="utf-8" src="<%=request.getContextPath()%>/themes/static/ajax/libs/summernote/summernote-bs4.js"></script>
<script language="javascript" charset="utf-8" src="<%=request.getContextPath()%>/themes/static/ajax/libs/summernote/summernote-lite.js"></script>
<script language="javascript" charset="utf-8" src="<%=request.getContextPath()%>/themes/static/ajax/libs/summernote/summernote-zh-CN.js"></script>
<script language="javascript" charset="utf-8" src="<%=request.getContextPath()%>/themes/static/ajax/libs/layer/layer.min.js"></script>

取值

var tt=$("#summernote").summernote("code");//取值
$("#remake").html(tt);//将值放入控件,最好是文本域