summernote.js虽然可以简单方便的生成富文本框内容html代码，但是他的图片插入方法非常滴银杏化(有毒)，是将整张图片的数据作为img_->src属性值，插入一张大点的图片我们的mysql数据长度可能就不够用了
河里操作： src属性值应该是一个url,
为此我们需要重写他的图片上传方法
下面是我的代码
<style>
.m{ width: 800px; margin-left: auto; margin-right: auto; }
</style>
<script>
<!--jquery入口函数-->
$(function(){
//重写summernote.js图片上传回调函数
$('#summernote').summernote({
height: 600,
tabsize: 2,
lang: 'zh-CN',
//重写的图片上传回调函数
callbacks: {
// onImageUpload callback
onImageUpload: function(files) {
// upload image to server and create imgNode...
var data = new FormData();
data.append("file", files[0]);
//通过ajax异步请求访问图片上传服务器，并替换img src属性地址
$.ajax({
data : data,
type : "POST",
url : IMG_UPLOAD_URL,
cache : false,
contentType : false,
processData : false,
dataType : "json",
success: function(res) {
//调用插入图片的方法,summernote(插入图片方法名,url,img标签名)
$('#summernote').summernote('insertImage',JSON.parse(res.data).img_url,'img');
},
error:function(){
alert("上传失败");
}
});
}
}
});
//富文本框查看生成html代码按钮
$("#test").click(function () {
// 获取富文本框内容
alert($('#summernote').summernote('code'));
})
});
</script>
</head>
<body>
<div class="m">
<div id="summernote"></div>
</div>
<!--富文本框查看生成html代码按钮-->
<input type="button" value="test" id="test">
</body>