通过jquery访问tinymce iframe元素 [英] To access tinymce iframe elements through jquery

问题描述

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

I an using Tinymce Editor. In need to access tinymce iframe with jquery I had tried...

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中.单击该图像后，我需要触发一个事件.救救我.

In my above code once an image inserted in tinymce iframe. Once i click that image i need to trigger an event. Help me.

推荐答案

通过使用以下内容，您可以更轻松地访问iframe文档:

You can get easier to the iframes document by using:

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

编辑:要实现所需的功能，您可以在tinymce内捕获click事件，并使用该事件进行操作. 您需要将此代码插入到自己的tinymce插件中，或使用tinymce init参数:

To achieve what you want you can catch the click event inside tinymce and do what you wish with it. You need to insert this code into an own tinymce plugin or use the tinymce init paramater:

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

这篇关于通过jquery访问tinymce iframe元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！