将OnMouseover事件添加到TinyMCE编辑器实例

Question

我想将onMouseOver和onMouseOut事件添加到TinyMCE中的编辑器实例中（通过插件），但是TinyMCE的API似乎不支持它们。 具体来说，我希望将鼠标悬停在该元素上以切换“只读”模式（以及可能的其他方式）时出现一个控件。 我是否需要自己向TinyMCE添加代码来执行此操作，还是通过一些非显而易见的途径来支持它？ 如果我必须添加代码，是否有一些禁止支持这些事件的规定，这些事件构成了将其不包括在API中的原因的基础？

为了澄清那些与下面的响应者有同样困惑的人的利益，我特别希望将事件附加到TinyMCE库创建的TinyMCE.Editor实例（例如，该类已传递给使用的回调在TinyMCE.init的设置参数中）。 我希望做到以下几点

tinyMCE.init({
  .
  .
  .
  setup : function(ed) { 
    TinyMCEReadOnlySetup(ed,true); 
    ed.onMouseOver.add(ShowButton(ed));
    ed.onMouseOut.add(HideButton(ed));
  },
  .
  .
  .
});

，但ed（TinyMCE.Editor的实例）不以类似事件的方式支持MouseOver.add。

Answer 1

要在只读模式和编辑模式之间切换，可以使用

ed.getDoc().designMode = "Off";

在您自己的插件中。 或者，您可以保存编辑器内容并在触发onChange时将其还原。

编辑：

要设置鼠标悬停事件监听器，您可以使用

$('#' + ed.id +'_parent').bind('mouseover',function (evt){
   setTimeout("console.log('mouseover')",50);return false;
});

您可以在插件的onInit部分中执行此操作。

Answer 2

好了，我能够通过创建一个插件，然后在init属性中添加以下非常hack-y的代码来使其工作：

ed.onInit.add(function(ed){
                   .
                   .
                   .

    document.getElementById(ed.id + '_parent').setAttribute('onmouseover',
      "tinyMCE.editor_ShowButton('" + ed.id + "');");
    document.getElementById(ed.id + '_parent').setAttribute('onmouseout',
      "tinyMCE.editor_HideButton('" + ed.id + "');");
    //ed.getBody().appendChild(newdiv);
 });

这不是最佳解决方案，但可以完成工作。