jquery - 通过jquery访问tinymce iframe元素

Question

我正在使用 Tinymce 编辑器。需要用jquery访问tinymce iframe我曾经尝试过...

var iframe = $('#comment_ifr')[0];//document.getElementById('comment_ifr');// or $('#comment_ifr')[0]; the other is just faster.
alert(iframe);
var doc = iframe.document || iframe.contentDocument || iframe.contentWindow && iframe.contentWindow.document || null;
   //if( !doc ) return;
   //and now jquery

$( "img", doc ).click(function() {
    alert('image clicked');
   });

----------

在我上面的代码中，一旦图像插入到tinymce iframe中。一旦我点击该图像，我需要触发一个事件。帮助我。

Answer 1

您可以使用以下方式更轻松地访问 iframe 文档:

var doc = tinymce.get('comment').getDoc();

编辑:要实现您想要的效果，您可以捕获tinymce内的点击事件并用它做您想做的事情。您需要将此代码插入到自己的tinymce插件中或使用tinymce init参数:

ed.onClick.add(function(ed, evt){

    // Firefox
    if (evt.explicitOriginalTarget){ // this is the img-element
      if (evt.explicitOriginalTarget.nodeName.toLowerCase() == 'img'){
        console.log(evt.explicitOriginalTarget);
        alert('image clicked');
      }
    }
    // IE
    else if (evt.target) { // this is the img-element
      if (evt.target.nodeName.toLowerCase() == 'img'){
        console.log(evt.target);
        alert('image clicked');
      }
    }
}); // end click event