kindeditor富文本编辑器的使用

第一步引入相应的js文件

<!-- 引入kindeditor -->
    <link rel="stylesheet" href="<%=basePath%>kindeditor-4.1.10/themes/default/default.css" />
    <link rel="stylesheet" href="<%=basePath%>kindeditor-4.1.10/plugins/code/prettify.css" />
    <script charset="utf-8" src="<%=basePath%>kindeditor-4.1.10/kindeditor.js"></script>
    <script charset="utf-8" src="<%=basePath%>kindeditor-4.1.10/lang/zh_CN.js"></script>
 <script type="text/javascript" src="<%=basePath%>jslib/noRefleshForm.js"></script>

第二步初始化kindeditor

</script>
    <script type="text/javascript">  
    var editor =null;
        KindEditor.ready(function(K) {
        editor= K.create('#kindeditor', {
                cssPath : '<%=basePath%>kindeditor-4.1.10/plugins/code/prettify.css',
                uploadJson : '<%=basePath%>uloadondown.action',//上传的请求
                fileManagerJson : '<%=basePath%>fmanage.action',
                allowFileManager : true         
            });
        });
    </script>

//html代码
<textarea id="kindeditor" name="data.tcontent"style="width:1000px;height:360px;">                    
               </textarea>

第三步写好相应的uploadimg .action和filemanage.action
filemanage

package bea.com.Action;

import java.io.File;
import java.io.FileInputStream;
import java.io.FileOutputStream;
import java.io.InputStream;
import java.io.PrintWriter;
import java.text.SimpleDateFormat;
import java.util.Arrays;
import java.util.Date;
import java.util.HashMap;
import java.util.Random;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.apache.commons.fileupload.servlet.ServletFileUpload;
import org.apache.log4j.Logger;
import org.apache.struts2.ServletActionContext;
import org.json.simple.JSONObject;

public class uploadimg extends BaseAction{
    static Logger log = Logger.getLogger(uploadimg.class);
      public String uloadondown() throws Exception {  
            //响应  
            HttpServletResponse response = ServletActionContext.getResponse();  
            response.setContentType("text/html; charset=UTF-8");  
            PrintWriter out = response.getWriter();  

            //请求  
            HttpServletRequest request = this.getRequest();  

            //文件保存目录路径  
            String savePath = ServletActionContext.getServletContext().getRealPath("/")+ "attached/";  

            //文件保存目录URL  
            String saveUrl  = request.getContextPath() + "/attached/";  

            //定义允许上传的文件扩展名  
            HashMap<String, String> extMap = new HashMap<String, String>();  
            extMap.put("image", "gif,jpg,jpeg,png,bmp");  
            extMap.put("flash", "swf,flv");  
            extMap.put("media", "swf,flv,mp3,wav,wma,wmv,mid,avi,mpg,asf,rm,rmvb");  
            extMap.put("file", "doc,docx,xls,xlsx,ppt,htm,html,txt,zip,rar,gz,bz2");  

            //最大文件大小  
            long maxSize = 1000000;  

            if(!ServletFileUpload.isMultipartContent(request)){  
                return error(out,"请选择文件。");  
            }  
            //检查目录  
            File uploadDir = new File(savePath);  
            if(!uploadDir.isDirectory()){  
                return error(out,"上传目录不存在。");  
            }  
            //检查目录写权限  
            if(!uploadDir.canWrite()){  
                return error(out,"上传目录没有写权限。");  
            }  

            String dirName = dir;  
            if (dirName == null) {  
                dirName = "image";  
            }  
            if(!extMap.containsKey(dirName)){  
                return error(out,"目录名不正确。");  
            }  
            //创建文件夹  
            savePath += dirName + "/";  
            saveUrl += dirName + "/";  
            File saveDirFile = new File(savePath);  
            if (!saveDirFile.exists()) {  
                saveDirFile.mkdirs();  
            }  
            SimpleDateFormat sdf = new SimpleDateFormat("yyyyMMdd");  
            String ymd = sdf.format(new Date());  
            savePath += ymd + "/";  
            saveUrl += ymd + "/";  
            File dirFile = new File(savePath);  
            if (!dirFile.exists()) {  
                dirFile.mkdirs();  
            }  

            if(imgFile != null && !imgFile.toString().equals("")){  
                long fileSize = imgFile.length();  
                if(fileSize > maxSize){  
                    return error(out,"上传文件大小超过限制。");  
                }  
                //检查扩展名  
                String fileExt = imgFileFileName.substring(imgFileFileName.lastIndexOf(".") + 1).toLowerCase();  
                if(!Arrays.<String>asList(extMap.get(dirName).split(",")).contains(fileExt)){  
                    return error(out,"上传文件扩展名是不允许的扩展名。\n只允许" + extMap.get(dirName) + "格式。");  
                }  

                SimpleDateFormat df = new SimpleDateFormat("yyyyMMddHHmmss");  
                String newFileName = df.format(new Date()) + "_" + new Random().nextInt(1000) + "." + fileExt;  

                File uploadedFile = new File(savePath, newFileName);  
                //获取文件输出流  
                FileOutputStream fos = new FileOutputStream(uploadedFile);  
                //获取内存中当前文件输入流  
                InputStream in = new FileInputStream(imgFile);  
                byte[] buffer = new byte[1024];  
                try {  
                    int num = 0;  
                    while ((num = in.read(buffer)) > 0) {  
                        fos.write(buffer, 0, num);  
                    }  
                } catch (Exception e) {  
                    log.error("kindEditor上传文件出错了！");  
                    return error(out,"上传的文件不存在!");  
                } finally {  
                    in.close();  
                    fos.close();  
                }  
                return success(out,saveUrl + newFileName);  
            }else{  
                return error(out,"上传的文件不存在!");  
            }  
        }  

        @SuppressWarnings("unchecked")  
        private String error(PrintWriter out,String message){  
            JSONObject obj = new JSONObject();  
            obj.put("error", 1);  
            obj.put("message", message);  
            out.println(obj.toJSONString());  
            return null;  
        }  

        @SuppressWarnings("unchecked")  
        private String success(PrintWriter out,String url){  
            JSONObject obj = new JSONObject();  
            obj.put("error", 0);  
            obj.put("url", url);  
            out.println(obj.toJSONString());  
            return null;  
        }  



        /** 
         * 上传的文件类型 
         */  
        public String dir;  

        public File imgFile;  
        private String imgFileFileName;  

        public String getDir() {  
            return dir;  
        }  

        public void setDir(String dir) {  
            this.dir = dir;  
        }  

        public File getImgFile() {  
            return imgFile;  
        }  

        public void setImgFile(File imgFile) {  
            this.imgFile = imgFile;  
        }  

        public String getImgFileFileName() {  
            return imgFileFileName;  
        }  

        public void setImgFileFileName(String imgFileFileName) {  
            this.imgFileFileName = imgFileFileName;  
        }  
    }  

filemanage.action

package bea.com.Action;

import java.io.File;
import java.io.PrintWriter;
import java.text.SimpleDateFormat;
import java.util.ArrayList;
import java.util.Arrays;
import java.util.Collections;
import java.util.Comparator;
import java.util.Hashtable;
import java.util.List;

import javax.servlet.http.HttpServletResponse;

import org.apache.log4j.Logger;
import org.apache.struts2.ServletActionContext;
import org.json.simple.JSONObject;

public class filemanage extends BaseAction{
    static Logger log = Logger.getLogger(filemanage.class);
     public String fmanage() throws Exception {  
            // 请求  


            // 根目录路径，可以指定绝对路径，比如 /var/www/attached/  
            String rootPath = ServletActionContext.getServletContext().getRealPath("/")+ "attached/";
            // 根目录URL，可以指定绝对路径，比如 http://www.yoursite.com/attached/  
            String rootUrl = this.getRequest().getContextPath() + "/attached/";  
            // 图片扩展名  
            String[] fileTypes = new String[] { "gif", "jpg", "jpeg", "png", "bmp" };  

            String dirName = this.getRequest().getParameter("dir");  
            if (dirName != null) {  
                if (!Arrays.<String> asList(  
                        new String[] { "image", "flash", "media", "file" })  
                        .contains(dirName)) {  
                    log.error("Invalid Directory name.");  
                }  
                rootPath += dirName + "/";  
                rootUrl += dirName + "/";  
                File saveDirFile = new File(rootPath);  
                if (!saveDirFile.exists()) {  
                    saveDirFile.mkdirs();  
                }  
            }  
            // 根据path参数，设置各路径和URL  
            String currentPath = rootPath + path;  
            String currentUrl = rootUrl + path;  
            String currentDirPath = path;  
            String moveupDirPath = "";  
            if (!"".equals(path)) {  
                String str = currentDirPath.substring(0,  
                        currentDirPath.length() - 1);  
                moveupDirPath = str.lastIndexOf("/") >= 0 ? str.substring(0,  
                        str.lastIndexOf("/") + 1) : "";  
            }  

            // 排序形式，name or size or type  
            String order = this.getRequest().getParameter("order") != null ? this.getRequest()  
                    .getParameter("order").toLowerCase() : "name";  

            // 不允许使用..移动到上一级目录  
            if (path.indexOf("..") >= 0) {  
                log.error("Access is not allowed.");  
            }  
            // 最后一个字符不是/  
            if (!"".equals(path) && !path.endsWith("/")) {  
                log.error("Parameter is not valid.");  
            }  
            // 目录不存在或不是目录  
            File currentPathFile = new File(currentPath);  
            if (!currentPathFile.isDirectory()) {  
                log.error("Directory does not exist.");  
            }  

            // 遍历目录取的文件信息  
            List<Hashtable> fileList = new ArrayList<Hashtable>();  
            if (currentPathFile.listFiles() != null) {  
                for (File file : currentPathFile.listFiles()) {  
                    Hashtable<String, Object> hash = new Hashtable<String, Object>();  
                    String fileName = file.getName();  
                    if (file.isDirectory()) {  
                        hash.put("is_dir", true);  
                        hash.put("has_file", (file.listFiles() != null));  
                        hash.put("filesize", 0L);  
                        hash.put("is_photo", false);  
                        hash.put("filetype", "");  
                    } else if (file.isFile()) {  
                        String fileExt = fileName.substring(  
                                fileName.lastIndexOf(".") + 1).toLowerCase();  
                        hash.put("is_dir", false);  
                        hash.put("has_file", false);  
                        hash.put("filesize", file.length());  
                        hash.put("is_photo", Arrays.<String> asList(fileTypes)  
                                .contains(fileExt));  
                        hash.put("filetype", fileExt);  
                    }  
                    hash.put("filename", fileName);  
                    hash.put("datetime",  
                            new SimpleDateFormat("yyyy-MM-dd HH:mm:ss").format(file  
                                    .lastModified()));  
                    fileList.add(hash);  
                }  
            }  

            if ("size".equals(order)) {  
                Collections.sort(fileList, new SizeComparator());  
            } else if ("type".equals(order)) {  
                Collections.sort(fileList, new TypeComparator());  
            } else {  
                Collections.sort(fileList, new NameComparator());  
            }  

            //响应  
            HttpServletResponse response = ServletActionContext.getResponse();  
            response.setContentType("application/json; charset=UTF-8");  
            PrintWriter out = response.getWriter();  

            JSONObject obj = new JSONObject();  
            obj.put("moveup_dir_path", moveupDirPath);  
            obj.put("current_dir_path", currentDirPath);  
            obj.put("current_url", currentUrl);  
            obj.put("total_count", fileList.size());  
            obj.put("file_list", fileList);  
            out.println(obj.toJSONString());  
            return null;  

        }  

        public class NameComparator implements Comparator {  
            public int compare(Object a, Object b) {  
                Hashtable hashA = (Hashtable) a;  
                Hashtable hashB = (Hashtable) b;  
                if (((Boolean) hashA.get("is_dir"))  
                        && !((Boolean) hashB.get("is_dir"))) {  
                    return -1;  
                } else if (!((Boolean) hashA.get("is_dir"))  
                        && ((Boolean) hashB.get("is_dir"))) {  
                    return 1;  
                } else {  
                    return ((String) hashA.get("filename"))  
                            .compareTo((String) hashB.get("filename"));  
                }  
            }  
        }  

        public class SizeComparator implements Comparator {  
            public int compare(Object a, Object b) {  
                Hashtable hashA = (Hashtable) a;  
                Hashtable hashB = (Hashtable) b;  
                if (((Boolean) hashA.get("is_dir"))  
                        && !((Boolean) hashB.get("is_dir"))) {  
                    return -1;  
                } else if (!((Boolean) hashA.get("is_dir"))  
                        && ((Boolean) hashB.get("is_dir"))) {  
                    return 1;  
                } else {  
                    if (((Long) hashA.get("filesize")) > ((Long) hashB  
                            .get("filesize"))) {  
                        return 1;  
                    } else if (((Long) hashA.get("filesize")) < ((Long) hashB  
                            .get("filesize"))) {  
                        return -1;  
                    } else {  
                        return 0;  
                    }  
                }  
            }  
        }  

        public class TypeComparator implements Comparator {  
            public int compare(Object a, Object b) {  
                Hashtable hashA = (Hashtable) a;  
                Hashtable hashB = (Hashtable) b;  
                if (((Boolean) hashA.get("is_dir"))  
                        && !((Boolean) hashB.get("is_dir"))) {  
                    return -1;  
                } else if (!((Boolean) hashA.get("is_dir"))  
                        && ((Boolean) hashB.get("is_dir"))) {  
                    return 1;  
                } else {  
                    return ((String) hashA.get("filetype"))  
                            .compareTo((String) hashB.get("filetype"));  
                }  
            }  
        }  

        public String path;  

        public String getPath() {  
            return path;  
        }  

        public void setPath(String path) {  
            this.path = path;  
        }  


    }  

第四步配置struts2

 <action name="fmanage" class="bea.com.Action.filemanage" method="fmanage"> </action>
     <action name="uloadondown" class="bea.com.Action.uploadimg" method="uloadondown"> </action>

这样就可以了

注意
新增时editor.sync();//先同步，才能拿到值
例如`function btn_add_news() {
editor.sync();//先同步，才能拿到值
var dataPara = getFormJson($(“#example”));$.ajax({
url : “insertNews”,
type : “post”,
data : dataPara,
dataType : ‘json’,
success : function(result) {

                if(result.cf=="OK"){                            
                  parent.$.messager.alert('提示', "新增成功！");
                  add_dialog.dialog('close');
                  dataGrid.datagrid('load');
                        }else{
                  parent.$.messager.alert('提示', "新增失败！");
                        }
                }
            });
        }`

修改时怎么把后台数据绑定到编辑器中只要一句代码
editor.html(result.tcontent);
例如、

 $.ajax({
                        type:"post",
                        url:"getNewForm?id="+id,
                        dataType:"json",
                        success:function(result){
                          $("#example").form('load',result);

                          editor.html(result.tcontent);

                            $('#dd').dialog({    
                                    title: '修改新闻', 
                                    close:false
                                    });
                        }
                    });