wangEditor富文字編輯器基本使用方法

2021-09-11 05:38:22 字數 850 閱讀 6839

1.用script標籤引入 wangeditor.js

2.初始化編輯器 **如下

//編輯器

var e = window.wangeditor;

var commentdiv = new e('#commentdiv');

//開啟本地上傳選項

commentdiv.customconfig.uploadimgserver = '$/wangupload'; //上傳url

commentdiv.customconfig.uploadimgmaxsize = 2 * 1024 * 1024;

commentdiv.customconfig.uploadimgmaxlength = 5;    

commentdiv.customconfig.uploadfilename = 'myfilename';

commentdiv.customconfig.uploadimghooks = 這種格式,即可這樣插入:

var url =result.data;

insertimg(url);        

// result 必須是乙個 json 格式字串!!!否則報錯}}

commentdiv.create();

3.獲取富文字的html內容與文字內容 

html:commentdiv.txt.html()

text:commentdiv.txt.text()

4.回顯富文字內容

commentdiv.txt.html(內容)

注意:回顯內容時如果內容中存在英文格式的單引號需進行轉義

如 commentdiv.txt.html().replace(/\'/g,"'")

wangEditor富文字編輯器

今天看了下文件,記錄下。wangeditor開發文件 html 確定js內容 var e window.wangeditor var editor new e editorbox 例項化文字編輯器 1 上傳伺服器獲取網路鏈結 editor.customconfig.uploadfilename my...

富文字編輯器wangEditor以及使用方法

首先看看他的介面效果 個人感覺這個富文字框非常簡潔,易於使用 然後給這個div容器進行初始化就是建立富文字控制項 var e window.wangeditor var editor new e document.getelementbyid editor editor.create 然後使用的話也...

富文字編輯器wangeditor的使用方法

附上富文字文件 首先引入富文字 import efrom wangeditor jsmounted editor.customconfig.uploadimgshowbase64 true editor.create editor.txt.html this ruleform.intro js的da...