【HTML】KindEditor編輯器在ASP.NET中使用

標籤：style   blog   http   color   io   使用   ar   strong   檔案   

本文大多內容來自KindEditor官網，自己加工理解後做的一個備份。

編輯器使用方法1. 下載編輯器

下載 KindEditor 最新版本，下載之後開啟 examples/index.html 就可以看到示範。

下載頁面: http://www.kindsoft.net/down.php

2.部署編輯器

解壓 kindeditor-x.x.x.zip 檔案，將所有檔案上傳到您的網站程式目錄裡

Note

您可以根據需求刪除以下目錄後上傳到伺服器。

• asp - ASP程式
• asp.net - ASP.NET程式
• php - PHP程式
• jsp - JSP程式
• examples - 示範檔案

3. 修改HTML頁面

1. 在需要顯示編輯器的位置添加textarea輸入框。

<textarea id="editor_id" name="content" style="width:700px;height:300px;">&lt;strong&gt;HTML內容&lt;/strong&gt;</textarea>

Noteid在當前頁面必須是唯一的值。在textarea裡設定HTML內容即可實現編輯，在這裡需要注意的是，如果從伺服器端程式(ASP、PHP、ASP.NET等)直接顯示內容，則必須轉換HTML特殊字元(>,<,&,”)。具體請參考各語言目錄下面的demo.xxx程式，目前支援ASP、ASP.NET、PHP、JSP。在有些瀏覽器上不設寬度和高度可能顯示有問題，所以最好設一下寬度和高度。寬度和高度可用inline樣式設定，也可用 編輯器初始化參數 設定。

2. 在該HTML頁面添加以下指令碼。

<script charset="utf-8" src="/editor/kindeditor.js"></script><script charset="utf-8" src="/editor/lang/zh_CN.js"></script><script>        KindEditor.ready(function(K) {                window.editor = K.create(‘#editor_id‘);        });</script>

4. 擷取HTML資料

// 取得HTML內容html = editor.html();// 同步資料後可以直接取得textarea的valueeditor.sync();html = document.getElementById(‘editor_id‘).value; // 原生APIhtml = K(‘#editor_id‘).val(); // KindEditor Node APIhtml = $(‘#editor_id‘).val(); // jQuery// 設定HTML內容editor.html(‘HTML內容‘);

5.設定範例以及使用

  地址 ： http://kindeditor.net/ke4/examples/default.html

6.使用樣本 下載

   ：     點  我  下  載

【HTML】KindEditor編輯器在ASP.NET中使用