如何通过tinymce启用/禁用选择更改时的自定义按钮

时间:2012-07-24 12:52:47

标签: 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.selection.getNode().className = 'preview';
            } else {
                alert('You need to select an image.');
            }
        }
    });

正如您所看到的,我使用“丑陋的方法”来禁用除图像之外的其他元素的类更改。如何以与默认按钮(如编辑图像或编辑链接)相同的方式禁用/启用按钮?我想我需要以某种方式捕捉选择更改,然后根据选择更改按钮状态,但我不知道如何做到这一点。

2 个答案:

答案 0 :(得分:7)

想出来 - 这很简单。我刚刚编辑了我的设置功能并添加了“onNodeChange”处理程序。

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';
        }
    });

}

答案 1 :(得分:0)

您可以使用控制管理中心提供的功能。

你可以使用ie。

        state = !state;
        ed.controlManager.setActive('my_button_id', state);