将jquery-1.4.4.4.min.js
xheditor-1.1.12-zh-cn.min.js
xheditor_emot
xheditor_plugins
xheditor_skin
放到WebContent的xheditor文件夹中。
将jquery-1.4.4.4.min.js和xheditor-1.1.12-zh-cn.min.js导入到页面
如：<script type="text/javascript" src="xheditor/jquery/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="xheditor/xheditor-1.1.12-zh-cn.min.js"></script>
xheditor初始化的js代码：
<script type="text/javascript">
$(document).ready(function(){
$('#elem1').xheditor({
tools:'full',
urlType:'rel',
upBtnText:'上传',
upMultiple:'1',
upImgUrl:'/OnlineExamManagement/servlet/UploadFileServlet',
upImgExt:'jpg,jpeg,gif,png,bmp',
onUpload:insertUpload
});
function insertUpload(msg){
var _msg = msg.toString();
var _picture_name = _msg.substring(_msg.lastIndexOf("/")+1);
var _picture_path = Substring(_msg);
var _str="<input type='checkbox' name='_picture' value='"+_picture_path+"' checked='checked' onclick='return false' /><label>"+_picture_name+"</label</br>";
var _img="<img id='image' src='"+_picture_path+"' />"
$("#elem1").append(_msg);
$("#uploadList").append(_str);
}
function Substring(s){
return s.substring(s.substring(0,s.lastIndexOf("/")).lastIndexOf("/"),s.length);
}
});
</script>
在需要用xheditor的地方：
<form action="" method="post">
<div>
<textarea id="elem1" name="contents" rows="10" style="width: 100%;border: 1px">
</textarea>
</div>
<div id="uploadList"></div>
<input type="submit" value="提交"/>
</form>
<%
String str=request.getParameter("contents");
out.write(str);
%>
------解决方案--------------------
servlet类：
package com.augmentum.xheditor;
import java.io.File;
import java.io.IOException;
import java.io.PrintWriter;
import java.io.Serializable;
import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.HashMap;
import java.util.Iterator;
import java.util.List;
import java.util.Map;
import java.util.UUID;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.apache.commons.fileupload.DiskFileUpload;