Javascript CKEditor中RichCombo框的动态菜单

我已经编写了一个插件，它在我的编辑器中添加了一个

RichCombo

框。我希望能够在此

RichCombo

这是我的密码

var merge_fields = [];

CKEDITOR.plugins.add('mergefields',
{
    requires: ['richcombo'], //, 'styles' ],
    init: function (editor) {
        var config = editor.config,
           lang = editor.lang.format;

        // Gets the list of tags from the settings.
        var tags = merge_fields; //new Array();

        // Create style objects for all defined styles.
        editor.ui.addRichCombo('tokens',
        {
            label: "Merge",
            title: "title",
            voiceLabel: "voiceLabel",
            className: 'cke_format',
            multiSelect: false,

            panel:
            {
                css: [config.contentsCss, CKEDITOR.getUrl(CKEDITOR.skin.getPath('editor') + 'editor.css')],
                voiceLabel: lang.panelVoiceLabel
            },

            init: function () {
                // this.startGroup("mergefields");
                for (var this_tag in tags) {
                    this.add(tags[this_tag], tags[this_tag], tags[this_tag]);
                }
            },

            onClick: function (value) {
                editor.focus();
                editor.fire('saveSnapshot');
                editor.insertText(value);
                editor.fire('saveSnapshot');
            }
        });
    }
});

不幸的是，当

合并\u字段

更改时，此列表不会更新。是否有方法重新初始化插件，或者如果失败，请删除插件并使用更新的内容重新添加插件

注意我不希望删除整个编辑器并替换它，因为这对用户来说非常不愉快

更新 根据要求，这里有一个JSFIDLE来帮助您

在这个JSFIDLE中，您将看到菜单是在第一次访问时动态创建的。它应该显示选中的复选框。但是，以后每次访问它时，它都会保留相同的值，并且不会更新。更新它的唯一方法是使用我提供的reinit按钮重新初始化编辑器，但这会导致编辑器消失并重新出现，所以我不想这样做

---

200点奖励给那些每次调用下拉列表都能动态更新的人。

我想我已经为你找到了解决办法

在

richCombo

的

init

函数中添加以下行：

$（'input'）。在（'click'，重建列表）

非常简单的JQuery修复，但每次单击这些输入框时，它都会重建列表

用小提琴来证明：
使用CKeditor自定义事件怎么样

首先获取对CKEditors实例的引用

var myinstance=CKEDITOR.instances.editor1

由于复选框不在CKEditor的范围内，请向复选框添加更改处理程序

$(':checkbox').change(function () {
    myinstance.fire('updateList'); // here is where you will fire the custom event
});

在插件定义内部，在编辑器上添加一个事件侦听器，如下所示

editor.on("updateList", function () { // this is the checkbox change listener
  self.buildList(); // the entire build is created again here
});

$(':checkbox').change(function () {
    CKEDITOR.instances.editor1.ui.instances.Merge.buildList(); //this method should build the entire list again
});

我使用的是CKEditor的自定义事件，而不是在插件内的复选框（不在CKEditor范围内）上直接附加事件。现在，编辑器实例和复选框已解耦

这里有一个

希望这有帮助

更新
选择2
插件的方法可以像这样直接调用

editor.on("updateList", function () { // this is the checkbox change listener
  self.buildList(); // the entire build is created again here
});

$(':checkbox').change(function () {
    CKEDITOR.instances.editor1.ui.instances.Merge.buildList(); //this method should build the entire list again
});

尽管这看起来很简单，但我不认为它是完全解耦的。（但仍然有效）

这里有一个
这看起来可能有帮助：这对我没有帮助。我尝试过的任何动态解决方案都只刷新一次。我需要我的更新尽可能多的次数。你能给JSFIDLE添加一些东西吗？这样我们就可以处理一些事情，而不必从头开始创建所有的东西？我最终奖励了这个答案，因为它更加完整，并且允许我从插件的上下文之外触发一个重建，这是我需要做的