JSP 教學 - kindeditor 介紹

kindeditor 也是類似於 fckeditor 的套件，為 google 的產品。


兩著比起來，kindeditor 的文字編輯樣板比較精簡好看，也提供各式各樣的樣板

其官網以及所有樣板如下：

http://www.kindsoft.net/　和　http://www.kindsoft.net/ke/examples/

接下來介紹如何使用 kindeditor  ，首先先去下載最新版的主程式　kindeditor-3.5.2.zip


下載完成並解壓縮成功之後可以再 WEB專案的根目錄中建立一個 editor 的資料夾

並將解壓縮後的內容複製進去，到這邊大致就完成了

接下來再要呈現文字編輯樣板的 HTML 或 JSP 中先加入以下的程式


<script src="editor/kindeditor.js" ></script>
<script>
       KE.show({
              id : 'your_editor_id'   //需對應到 textarea 標籤的 id
       });
</script>


最後以一個 textarea 為範例呈現


<textarea id="your_editor_id" name="content" cols="100" rows="8" style="width:700px;height:300px;"></textarea>


如果要在前台使用 javascript 抓取在 textarea 標籤裡的值可以如下:


function save()
{
    var s = KE.util.getData("your_editor_id");
    s = KE.util.escape(s);
    alert(s);
}



大致上就是這樣，比起 fckeditor 還簡單吧