释放双眼，带上耳机，听听看~！
拆分百度编辑器，实现网站评论和图片上传
-
效果如下：
我们可以通过修改百度编辑器来达到比较美观的效果。图一是将百度编辑器改成一个评论区。图二是只提取百度编辑器的上传图片功能，这比自己写的上传功能美观多了，同时功能也是更为丰富。
-
对于第一个功能的实现比较容易，可以参看百度编辑器的文档，定制工具图标 。修改ueditor.config.js 37行左右的toolbars，就可以。
-
同时对于文字字数的限制：可以在257行左右进行设置
-
对于第二个功能的实现，也就是将我们传统的上传图片按钮包装成百度编辑器式：
2
3
2<input type="text" class="form-control" placeholder="点击按钮选择图片" id="sport-cover" name="sport.cover" autocomplete="off">
3
Api文档
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
2<script type="text/javascript" charset="utf-8" src="<%=basePath%>ueditor/ueditor.config.js"></script>
3<script type="text/javascript" charset="utf-8" src="<%=basePath%>ueditor/ueditor.all.min.js"> </script>
4
5<!--利用ueditor的单图的上传 ，定义一个百度编辑器 -->
6<script id="uploadUe" type="text/plain" ></script>
7
8<!--amdin 单图上传cover -->
9<script type="text/javascript">
10
11 var ue = UE.getEditor('editor');// 一定要先得到百度编辑器容器
12
13 var uploadUe = UE.getEditor('uploadUe');//用于上传图片（sport-cover）
14 var isUploadCover = false;
15 $(function(){
16 uploadUe.ready(function(){
17 uploadUe.setDisabled(['insertimage']);
18 uploadUe.hide();
19 uploadUe.addListener('beforeInsertImage', function (t, arg) {
20 //得到单图片地址
21 $('#sport-cover').prop('value', arg[0].src);
22 $('#imgPreview').attr('src', arg[0].src);
23 $('#imgPreview').css('height',300);
24 $('#imgPreview').css('width',290);
25 isUploadCover = true;
26 });
27 });
28 });
29 $('#upImage').click(function () {
30 var myImage = uploadUe.getDialog('insertimage');
31 myImage.open();
32 });
33</script>
34
源码或运行文件及数据库
SSH：利用Struts2+Hibernate4+Spring4+SQLServer框架，搭建一个前后端web网站（1）
SSH：利用Struts2+Hibernate4+Spring4+SQLServer框架，搭建一个前后端web网站（2）
SSH：利用Struts2+Hibernate4+Spring4+SQLServer框架，搭建一个前后端web网站（3）
SSH：利用Struts2+Hibernate4+Spring4+SQLServer框架，搭建一个前后端web网站（5）
