xheditor 是一款比较好用的文本编辑器,具体如何使用这里不在说了,网上有很多,也可以查看自带demos文件。这里说说文件的上传。
页面
<script type="text/javascript" src="<c:url value="/js/jquery.js"/>"></script> <script type="text/javascript" src='<c:url value="/xheditor/xheditor-1.2.2.min.js"/>'></script> <script type="text/javascript" src='<c:url value="/xheditor/xheditor_lang/zh-cn.js"/>'></script><%--中文显示--%> <textarea id="editor01" rows="40" cols="80" name="XXX" class="w_all" >编辑</textarea><%--w_al 是所有的功能--%>
js注意之前要导jquery的js文件,
/* upFile 表示上传地址 这里面一定要把:html5Upload : false,不然action无法获取数据 */ $(document).ready(function() { $('#editor01').xheditor({ html5Upload : false, upMultiple : '1', upLinkUrl : "upFile?immediate=1", upLinkExt : "zip,rar,txt", upImgUrl : "upFile?immediate=1", upImgExt : "jpg,jpeg,gif,png", upFlashUrl : "upFile?immediate=1", upFlashExt : "swf", upMediaUrl : "upFile?immediate=1", upMediaExt : "avi" }); });
java代码;采用struts2
import java.io.File; import java.io.IOException; import java.util.UUID; import org.apache.commons.io.FileUtils; import org.apache.struts2.ServletActionContext; import com.opensymphony.xwork2.ActionSupport; public class UpFile extends ActionSupport { //文件名必须是filedata,因为xheditor的name值为filedata private File filedata; private String filedataContentType; private String filedataFileName; /** * 上传文件 */ public String execute() { String saveRealFilePath = ServletActionContext.getServletContext() .getRealPath("/upload");//保存上传资料的目录 File fileDir = new File(saveRealFilePath); /** * 如果文件夹不存在创建一个文件夹 */ if (!fileDir.exists()) { fileDir.mkdirs(); } /** * 判断文件名是否存在 */ if (filedataFileName == null) return null; /** * 随机生成一同类型,文件名不重复的文件 */ String newName = UUID.randomUUID() + filedataFileName.substring(filedataFileName.lastIndexOf(".")); File savefile = new File(saveRealFilePath + "/" + newName); try { // 复制文件 FileUtils.copyFile(filedata, savefile); //回写json数据 ServletActionContext.getResponse().getWriter() .println(getJson("", "/upload/" + newName)); ; } catch (IOException e) { throw new RuntimeException(e); } return null; } public File getFiledata() { return filedata; } public String getFiledataContentType() { return filedataContentType; } public String getFiledataFileName() { return filedataFileName; } /** * 获取返回json数据 * @param err * @param newFileName * @return */ public String getJson(String err, String newFileName) { //json的格式很重要** return "{\"err\":\"" + err + "\",\"msg\":\"" + ServletActionContext.getRequest().getContextPath() + File.separatorChar + newFileName + "\"}"; } public void setFiledata(File filedata) { this.filedata = filedata; } public void setFiledataContentType(String filedataContentType) { this.filedataContentType = filedataContentType; } public void setFiledataFileName(String filedataFileName) { this.filedataFileName = filedataFileName; } }