TinyMCE 中的动态菜单按钮项

Question

我的 tinyMCE 编辑器中有一个自定义菜单按钮，它使用页面其他地方的特定 HTML 元素作为菜单项。我使用 jQuery 选择器获取元素列表，然后分别添加一个作为菜单项:

c.onRenderMenu.add(function(c,m) {
  m.add({ title: 'Pick One:', 'class': 'mceMenuItemTitle' }).setDisabled(1);
  $('span[data-menuitem]').each(function() {
    var val = $(this).html();
    m.add({ 
      title: $(this).attr("data-menuitem"), 
      onclick: function () { tinyMCE.activeEditor.execCommand('mceInsertContent', false, val) }
    });
  });
});

我的问题是，这只会在首次单击按钮和首次呈现菜单时发生一次。当前页面上的 HTML 元素偶尔会根据用户点击和一些 AJAX 发生变化，因此我需要在每次呈现菜单时运行此选择器代码，以确保菜单完全是最新的。这可能吗？

如果做不到这一点，是否可以从页面其他地方的 AJAX 调用结束时动态更新控件？我不确定如何访问菜单项并对其进行更新。使用 tinyMCE.activeEditor.controlManager...？

谢谢!

Answer 1

我找到了这个问题的解决方案，尽管我不确定这是最好的方法。

看起来我无法让 tinyMCE 重新呈现菜单，所以我在 AJAX 调用的末尾添加了一些代码:在更新 DOM 之后，它会手动更新 tinymce 下拉菜单。

可以使用以下方式访问菜单对象:

tinyMCE.activeEditor.controlManager.get('editor_mybutton_menu')

其中 mybutton 是我的自定义控件的名称。我的快捷解决方案是在此菜单对象上调用 removeAll()(以删除所有当前菜单项)，然后重新执行我的选择器代码以在 ( new) DOM 并根据新状态添加回菜单项。

它似乎工作得很好，但总是欢迎调整和想法!