1. 程式人生 > >富文字編輯框

富文字編輯框

官網下載:     http://kindeditor.net/demo.php

文件目錄

├── attached                  空資料夾,放置關聯檔案attached
├── examples                 HTML示例
├── kindeditor-all-min.js 全部JS(壓縮)
├── kindeditor-all.js        全部JS(未壓縮)
├── kindeditor-min.js      僅KindEditor JS(壓縮)
├── kindeditor.js            僅KindEditor JS(未壓縮)
├── lang                        支援語言
├── license.txt               License
├── plugins                    KindEditor內部使用的外掛
└── themes                   KindEditor主題

基本

<textarea name="content" id="content"></textarea>
 
<script src="/static/jquery-1.12.4.js"></script>
<script src="/static/plugins/kind-editor/kindeditor-all.js"></script>
<script>
    $(function () {
        initKindEditor();
    });
     var kind = null;
    function initKindEditor() {
        kind = KindEditor.create('#content', {
            width: '100%',       // 文字框寬度(可以百分比或畫素)
            height: '300px',     // 文字框高度(只能畫素)
            minWidth: 200,       // 最小寬度(數字)
            minHeight: 400      // 最小高度(數字)
        });
    }
</script>

HTML獲取編輯框內容  kind.html()

詳細引數

http://kindeditor.net/docs/option.html

items :配置編輯器的工具欄,其中”/”表示換行,”|”表示分隔符。

pasteType
設定貼上型別,0:禁止貼上, 1:純文字貼上, 2:HTML貼上
資料型別: Int
預設值: 2

filePostName
指定上傳檔案form名稱。
資料型別: String
預設值: imgFile