Ueditor编辑器添加自定义按钮
程序员文章站
2022-05-26 13:19:37
...
首先在ueditor根目录找到文件ueditor.all.js,在最后大括号里添加:
UE.registerUI('button', function(editor, uiName) {
//注册按钮执行时的command命令,使用命令默认就会带有回退操作
editor.registerCommand(uiName, {
execCommand: function() {
setTimeout(function(){
alert('execCommand:' + uiName)
}, 500);
alert('execCommand:' + uiName)
}
});
//创建一个button
var btn = new UE.ui.Button({
//按钮的名字
name: uiName,
//提示
title: "编辑器目前支持从word单点复制和从文件夹拖拽上传图片!",
//添加额外样式,指定icon图标,这里默认使用一个重复的icon
cssRules: 'background-position: -340px 0;',
//点击时执行的命令
onclick: function() {
//这里可以不用执行命令,做你自己的操作也可
editor.execCommand(uiName);
}
});
//当点到编辑内容上时,按钮要做的状态反射
editor.addListener('selectionchange', function() {
var state = editor.queryCommandState(uiName);
if (state == -1) {
btn.setDisabled(true);
btn.setChecked(false);
} else {
btn.setDisabled(false);
btn.setChecked(state);
}
});
//因为你是添加button,所以需要返回这个button
return btn;
});