Javascript 如何基于ContentTools上的内容禁用/启用工具？

我正在我的页面中使用ContentTools插件。我需要一种方法来禁用和启用基于用户正在编辑的内容的工具。例如，在所有内容中，只有一个

div

，我希望用户能够在其中上载图像，以此类推。

在项目的GitHub问题中，曾经提出过这个问题：

基本上，推荐的方法是针对元素监视

focus

事件，然后根据您希望该元素支持的工具更新工具箱。如何标记元素中可用的工具取决于您，但下面的示例针对元素测试是否存在CSS类，以确定要显示哪些工具：

# Define a set of tools for elements flagged as text only
TEXT_ONLY_TOOLS = [
    [
        'bold',
        'italic',
        'link'
    ]
];

# Monitor the editor for focus events
var editor = ContentTools.EditorApp.get();
editor.myToolsState = 'all-tools';
ContentEdit.Root.get().bind('focus', function (element){

  # If the element with focus has the CSS class `text-only` set the
  # tools in the toolbox to `TEXT_ONLY_TOOLS`...
  if (element.domElement().classList.contains('text-only')) {
    if (editor.myToolsState != 'text-only') {
      editor.myToolsState = 'text-only';
      editor.toolbox().tools(TEXT_ONLY_TOOLS);
    }

  # ...otherwise set the tools in the toolbox to `DEFAULT_TOOLS`.
  } else {
    if (editor.myToolsState != 'all-tools') {
      editor.myToolsState = 'all-tools';
      editor.toolbox().tools(ContentTools.DEFAULT_TOOLS);
    }
  }
});

---

显然，如果你有很多变体，你可能想建立一个CSS类字典（或者可能是

数据工具

属性），映射到工具集，而不是创建一个大的if测试集。

因此不是询问这个问题的地方，你需要去插件的文档。我已经阅读了文档。没什么，好吧。然后你需要向我们提供更多的信息，它的代码和演示，如果可以的话。