1,首先jsp页面上要加上这个:
导入kindeditor的包基础包和一些样式(basePath为当前项目的路径) <link rel="stylesheet" href="<%=basePath%>JavaScript/kindeditor/themes/default/default.css" charset="utf-8"></link> <link rel="stylesheet" href="<%=basePath%>JavaScript/kindeditor/themes/simple/simple.css" charset="utf-8"></link> <script type="text/javascript" src="<%=basePath%>JavaScript/kindeditor/kindeditor-min.js"></script> <script type="text/javascript" src="<%=basePath%>JavaScript/kindeditor/lang/zh_CN.js"></script>
页面中的这段不可少,第一个input可以设置为隐藏,一般是用来展示保存的文件路径的。
<div class="upload"> <input class="ke-input-text" type="text" id="url" value="" readonly="readonly" /> <input type="button" id="uploadButton" value="选择头像" /> </div>
2.还要加上这段JS,将button按钮绑定为kindeditor上传按钮
<script type="text/javascript"> KindEditor.ready(function(K) { var uploadbutton = K.uploadbutton({ button : K('#uploadButton')[0], fieldName : 'imgFile', url : '<%=basePath%>JavaScript/kindeditor/jsp/upload_json.jsp?dir=image&EMPID=<%=EMPID%>', afterUpload : function(data) { if (data.error === 0) { var url = K.formatUrl(data.url, 'absolute'); K('#url').val(url); alert(data.message); } else { alert(data.message); } }, afterError : function(str) { alert('自定义错误信息: ' + str); } }); uploadbutton.fileBox.change(function(e) { uploadbutton.submit(); }); }); </script>
3.在upload_json.jsp页面对保存路径等一系列进行配置。