首頁
手機版
熱門搜索:
當前位置:電腦軟件 > 編程開發 > 編程軟件 > KindEditor富文本編輯器 中文版v4.1.11

KindEditor富文本編輯器 中文版v4.1.11

  • 大。737.0 KB
  • 語言:中文
  • 類別:編程軟件
  • 類型:免費軟件
  • 授權:國產軟件
  • 時間:2020/9/15
  • 官網:http://www.851646.tw/
  • 環境:Windows7, Windows10, WindowsAll

相關軟件

KindEditor編輯器是一款代碼編輯器,使用JavaScript編寫,可以用于Java、.NET、PHP、ASP等各種代碼語言的編輯,軟件中提供了編輯代碼時必備的各種功能,比如高亮功能等等,另外軟件還支持插件,你有需要的功能,可以直接通過安裝插件的方式來進行新功能的添加。

軟件介紹

KindEditor編輯器圖片

KindEditor中文版使用JavaScript編寫,可以無縫的于Java、.NET、PHP、ASP等程序接合。 KindEditor非常適合在CMS、商城、論壇、博客、Wiki、電子郵件等互聯網應用上使用,2006年7月首次發布2.0以來,KindEditor依靠出色的用戶體驗和領先的技術不斷擴大編輯器市場占有率,目前在國內已經成為最受歡迎的編輯器之一。

軟件特色

1. KindEditor中文版體積小,加載速度快,但功能十分豐富。

2. 內置自定義range,完美地支持span標記。

3. 基于插件的方式設計,所有功能都是插件,增加自定義和擴展功能非常簡單。

4. 修改編輯器風格很容易,只需修改一個CSS文件。

5. 支持大部分主流瀏覽器,比如IE、Firefox、Safari、Chrome、Opera。

使用說明

KindEditor是一款富文本編輯器,這款軟件需要先進行安裝,然后在瀏覽器中輸入正確的地址才能打開使用,軟件的使用有不小的門檻,很多的用戶不知道軟件的使用方法,下面小編為大家帶來入門使用教程,快來一起看看吧。

1. 下載編輯器

下載 KindEditor 最新版本,下載之后打開 examples/index.html 就可以看到演示。

2. 部署編輯器

解壓 kindeditor-x.x.x.zip 文件,將所有文件上傳到您的網站程序目錄里,例如://您的域名/editor/

KindEditor編輯器使用說明圖

3. 修改HTML頁面

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

KindEditor編輯器使用說明圖2

在該HTML頁面添加以下腳本。

KindEditor編輯器使用說明圖3

4. 獲取HTML數據

KindEditor編輯器使用說明圖4

一鍵排版教程

作為一款編輯器,一鍵排版功能是非常重要的,可以一鍵幫助用戶刪除內容中一些無用的空格、空行和無用的內容,不用用戶手動去進行一項項檢查和刪除,節約用戶大量的時間,下面小編為大家帶來一鍵排版功能的制作教程。

修改文件

引用kindeditor-all-min.js 就修改 kindeditor-all-min.js

我是直接引用 kindeditor-all.js,則修改kindeditor-all.js

直接快速搜索 關鍵詞 quickformat

找到 KindEditor.plugin(‘quickformat’, function (K) {}方法

修改其中的代碼

注意:其他方法說修改 plugin文件夾下的quickformat的JS文件中,

KindEditor編輯器一鍵排版教程圖

其中(下圖),并沒起作用

KindEditor編輯器一鍵排版教程圖2

于是我只得自己探索了,終于在我拖拖拉拉的尋找中,找到了這個方法

可行方法,具體代碼如下

KindEditor編輯器一鍵排版教程圖3

以上利用child.css添加的樣式,是會添加到p的style中

由于行距的樣式 放在span中才起作用,因此需要直接加到內容的兩側

加粗的樣式 也是標簽在起作用,因此也是直接加到內容的兩側

如果你想恢復到默認樣子,可以對照plugin文件夾下的quickformat的JS文件

上傳圖片教程

在編輯器中添加上傳圖片的按鈕功能并不是簡單的添加按鈕即可,需要先進行代碼的編輯,在軟件中完成表單的制作,圖片上傳前后端接口的添加,然后和服務器進行連接,一系列的復雜操作之后,才能成功添加該功能,下面小編為大家帶來該教程。

工具欄中圖片上傳的表單 name 值為 imgFile

KindEditor編輯器上傳圖片教程圖

圖片上傳前后端接口,必須返回這樣格式的 json 字符串,才會回調 afterUpload 屬性指定的回調函數。

KindEditor編輯器上傳圖片教程圖2

1、請求參數

​ imgFile: 文件form名稱

​ dir: 上傳類型,分別為image、flash、media、file

KindEditor編輯器上傳圖片教程圖3

2、服務器響應數據

KindEditor編輯器上傳圖片教程圖4

3、回調函數

url 表示上傳成功時返回的文件url地址

data 服務器響應的json對象

name 上傳類型,如:圖片上傳,多圖片上傳,文件上傳。取值: image multiimage insertfile

注意:參數是按照位置給值的,如果回調只有一個參數,那么就表示 url , 如果回調有2個參數,那么依次表示 (url, data) , 如果回調有3個參數,那么依次表示 (url, data, name)

KindEditor編輯器上傳圖片教程圖5

(點擊圖片查看大圖)

單圖片上傳交互數據

KindEditor編輯器上傳圖片教程圖5

 

KindEditor編輯器上傳圖片教程圖6

常見問題

編輯器好像是UTF-8編碼的,可以在GB2312頁面上使用嗎?

可以使用。有兩種方法,一種方法是引入kindeditor.js文件時將script的charset屬性設置成utf-8。

還有一種方法是直接將html/js/css文件編碼都轉換成GB2312編碼(用Notepad++、editPlus等文本編輯器就可以轉換編碼),不過轉換格式后升級比較困難,建議使用第一種方法。

  我取不到編輯器數據,直接取得textarea的value也沒用。

KindEditor的可視化操作在新創建的iframe上執行,代碼模式下的textarea框也是新創建的,所以最后提交前需要執行 sync() 將HTML數據設置到原來的textarea。

KindEditor在默認情況下自動尋找textarea所屬的form元素,找到form后onsubmit事件里添加editor.sync()函數,所以用form方式提交數據,不需要手動執行editor.sync()函數。

  為什么有些標簽被過濾?

KindEditor默認采用白名單過濾方式,可用 htmlTags 參數定義要保留的標簽和屬性。當然也可以用 filterMode 參數關閉過濾模式,保留所有標簽。

更新日志

新增: extraFileUploadParams初始化參數,文件上傳時,支持添加別的參數一并傳到服務器;

變更: filterMode默認值改成true,根據htmlTags配置過濾HTML代碼;

Bugfix: [Chrome] 粘貼內容代碼中出現white-space:nowrap導致不換行;

Bugfix: [IE6] 本地圖片上傳按鈕錯位;

Bugfix: 開啟過濾模式后,預覽內容顯示KindEditor。

標簽: 富文本編輯器 代碼編輯器

下載地址

KindEditor富文本編輯器 中文版v4.1.11

普通下載通道

網友評論

返回頂部
超级大乐透开奖结果