Javascript 如何使用tinymce在选择更改时启用/禁用自定义按钮
我使用这段代码创建了一个定制的tinymce按钮,用于更改一类图像。它在设置块中Javascript 如何使用tinymce在选择更改时启用/禁用自定义按钮,javascript,tinymce,wysiwyg,Javascript,Tinymce,Wysiwyg,我使用这段代码创建了一个定制的tinymce按钮,用于更改一类图像。它在设置块中 ed.addButton('cust_setimgaspreview', { title : 'Set image as a preview image', image : 'ikony/previews.png', onclick : function() { if(ed.selection.getNode().tagName == 'IMG
ed.addButton('cust_setimgaspreview', {
title : 'Set image as a preview image',
image : 'ikony/previews.png',
onclick : function() {
if(ed.selection.getNode().tagName == 'IMG')
{
ed.selection.getNode().className = 'preview';
} else {
alert('You need to select an image.');
}
}
});
正如您所看到的,我使用了一种“丑陋的方法”来禁用对图像以外的其他元素的类更改。如何以与tinymce使用默认按钮(如编辑图像或编辑链接)相同的方式禁用/启用按钮?我想我需要以某种方式捕捉选择的变化,然后根据选择改变按钮状态,但我没有ide如何做到这一点。您可以使用控制管理器提供的功能 你可以用
state = !state;
ed.controlManager.setActive('my_button_id', state);
只是想出来了-很简单。我刚刚编辑了设置函数并添加了“onNodeChange”处理程序
实际上,我必须将setDisabled与“onNodeChange”结合使用,但您为我指明了正确的方向。谢谢对于TinyMCE 4,示例如下:
setup : function(ed) {
ed.onNodeChange.add(function(ed, cm, node) {
cm.setDisabled('cust_setimgaspreview', !(node.tagName == 'IMG'))
});
ed.addButton('cust_setimgaspreview', {
title : 'Set image as a preview image',
image : 'ikony/previews.png',
onclick : function() {
ed.selection.getNode().className = 'preview';
}
});
}