ueditor編輯器新增自定義按鈕

2021-09-02 14:19:58 字數 2643 閱讀 5679

一，ueditor的使用過程：

在jsp檔案中引入ueditor.all.js,ueditor.config.js,ueditor.css，zh-cn.js檔案。

二，ueditor新增自定義按鈕。

新增乙個「add」功能按鈕到ueditor上。  

第一步：找到：ueditor.config.js檔案中的toobars處，新增'add'，全小寫

*******s: [[


'fullscreen', 'source', '|', 'undo', 'redo', '|',


'bold', 'italic', 'underline', 'fontborder', 'strikethrough', 'superscript', 'subscript', 'removeformat', 'formatmatch', 'autotypeset', 'blockquote', 'pasteplain', '|', 'forecolor', 'backcolor', 'insertorderedlist', 'insertunorderedlist', 'selectall', 'cleardoc', '|',


'rowspacingtop', 'rowspacingbottom', 'lineheight', '|',


'customstyle', 'paragraph', 'fontfamily', 'fontsize', '|',


'directionalityltr', 'directionalityrtl', 'indent', '|',


'justifyleft', 'justifycenter', 'justifyright', 'justifyjustify', '|', 'touppercase', 'tolowercase', '|',


'link', 'unlink', 'anchor', '|', 'imagenone', 'imageleft', 'imageright', 'imagecenter', '|',


'horizontal', 'date', 'time', 'spechars', 'snapscreen', 'wordimage', '|',


'inserttable', 'deletetable', 'insertparagraphbeforetable', 'insertrow', 'deleterow', 'insertcol', 'deletecol', 'mergecells', 'mergeright', 'mergedown', 'splittocells', 'splittorows', 'splittocols', 'charts', '|',


'print', 'preview', 'searchreplace', 'help', 'drafts',


'add'      


]]
第二步：找到zh-cn.js檔案，在labelmap出新增'add':'新增自定義按鈕'，給出按鈕的懸浮提示。

ue.i18n['zh-cn'] = ,
第三步：找到ueditor.all.js檔案的btncmds出新增『add』

//為工具欄新增按鈕，以下都是統一的按鈕觸發命令，所以寫在一起


var btncmds = ['undo', 'redo', 'formatmatch',


'bold', 'italic', 'underline', 'fontborder', 'touppercase', 'tolowercase',


'strikethrough', 'subscript', 'superscript', 'source', 'indent', 'outdent',


'blockquote', 'pasteplain', 'pagebreak',


'selectall', 'print','horizontal', 'removeformat', 'time', 'date', 'unlink',


'insertparagraphbeforetable', 'insertrow', 'insertcol', 'mergeright', 'mergedown', 'deleterow',


'deletecol', 'splittorows', 'splittocols', 'splittocells', 'mergecells', 'deletetable', 'drafts',


'add'];
第四步：新增自定義按鈕對應的功能。將其寫入你的jsp頁面也可以，新增在ueditor.all.js檔案中也行。

//自定字按鈕的功能


ue.commands['add']=


}
第五步：新增自定義按鈕的樣式。在ueditor.css中新增也行，jsp頁面也行。按鈕的類屬性.edu-for-add 是ueditor自動拼接的。

將自定義的同名放在themes/default/images下。

.edui-default  .edui-******* .edui-for-add  .edui-icon

ext自定義編輯器

現在搞安卓已經有幾個月了。安卓實在是博大精深，幾個月下來感覺自己還是個門外漢，什麼廣播，什麼aidl。都不怎麼會用。做的軟體總感覺把握不住。感覺道路還很漫長。既然學習路程這麼漫長，過程中也有休息的時候，今天看了下以前學習ssh開發的乙個系統，頓時感覺自己在退步。以前開發的，現在感覺做起來有點困難。這...

Unity 自定義編輯器視窗 拓展編輯器功能

最近學習了unity自定義編輯器視窗，下面簡單總結，方便用到時回顧。新建乙個指令碼 using unityengine using system.collections using unityeditor 自定義的編輯器視窗 public class mywindow editorwindow vo...

spring中的自定義編輯器

spring中的自定義編輯器 乙個bean中有另乙個bean的屬性，用自定義編輯器，可以省bean標籤。public class addressediter extends propertyeditorsupport override public void setastext string tex...