BootStrap富文本编辑器Summernote

页面只需要给一个textarea标签，之后用JS渲染富文本编辑器，可以在textarea标签中设置默认内容。

通过JS渲染及设置富文本编辑器的属性。

$(function() {

$(’#summernote’).summernote({

height: 400, //设置高度

toolbar: [ //自定义工具栏

[‘style’,[‘style’]],

[‘font’,[‘bold’,‘underline’,‘clear’]],

[‘fontname’,[‘fontname’]],

[‘color’,[‘color’]],

[‘para’,[‘ul’,‘ol’,‘paragraph’, ‘height’, ‘hr’]],

[‘table’,[‘table’]],

[‘insert’,[‘link’,‘picture’,‘video’]],

[‘view’,[‘fullscreen’,‘codeview’,‘help’]]

],

tabsize : 2,

lang : ‘zh-CN’,

callbacks : { // 回调函数

// 图片上传

onImageUpload: function(files) {

var formData = new FormData();

formData.append(“file”, files[0]);

$.ajax({

url: ‘textEdit/imgUpload’, //后台文件上传接口

type: ‘POST’,

data: formData,

processData: false,

contentType: false,

success: function (data) {

//图片插入到summernote中

$("#summernote").summernote(‘insertImage’, data);

},

error: function () {

alert(“上传失败”)

}

})

},

//清除word复制的格式

onPaste: function (ne) {

var bufferText = ((ne.originalEvent || ne).clipboardData || window.clipboardData).getData