給web項目整合富文字編輯器

標籤：form   getc   comm   edit   theme   contex   ref   取數   function   

給jsp頁面整合富文字編輯器
下載——刪除多餘的組件——加入到項目中——參照案例來完成整合
步驟：
1. 解壓zip檔案，將所有檔案複製到Tomcat的webapps/kindeditor目錄下。

2. 將kindeditor/jsp/lib目錄下的3個jar檔案複製到Tomcat的lib目錄下，並重新啟動Tomcat。
 * commons-fileupload-1.2.1.jar
 * commons-io-1.4.jar
 * json_simple-1.1.jar
以下用我下載的副文字編輯器為例
3.把下邊的整合代表粘貼到目標檔案中（記得修改必要的資料）
代碼如下：
<link rel="stylesheet" href="<%=request.getContextPath() %>/kindeditor/themes/default/default.css" />
 <link rel="stylesheet" href="<%=request.getContextPath() %>/kindeditor/plugins/code/prettify.css" />
 <script charset="utf-8" src="<%=request.getContextPath() %>/kindeditor/kindeditor.js"></script>
 <script charset="utf-8" src="<%=request.getContextPath() %>/kindeditor/lang/zh_CN.js"></script>
 <script charset="utf-8" src="<%=request.getContextPath() %>/kindeditor/plugins/code/prettify.js"></script>
 <script>
  KindEditor.ready(function(K) {
  //這裡名字是富文本域的name，後台取資料時用的name
   var editor1 = K.create(‘textarea[name="context"]‘, {
    cssPath : ‘<%=request.getContextPath() %>/kindeditor/plugins/code/prettify.css‘,
    uploadJson : ‘<%=request.getContextPath() %>/kindeditor/jsp/upload_json.jsp‘,
    fileManagerJson : ‘<%=request.getContextPath() %>/kindeditor/jsp/file_manager_json.jsp‘,
    allowFileManager : true,
    afterCreate : function() {
     var self = this;
     K.ctrl(document, 13, function() {
      self.sync();
      //注意修改這裡的form表單的名字
      document.forms[‘nameForm‘].submit();
     });
     K.ctrl(self.edit.doc, 13, function() {
      self.sync();
      document.forms[‘nameForm‘].submit();
     });
    }
   });
   prettyPrint();
  });
 </script
4.運行項目，效果就出來了。

給web項目整合富文字編輯器