jQuery - Trying to select element from iFrame (point and click)

Question

I'm trying to get the id and element name from the HTML tags. This code works:

jQuery(document).ready(function(){
   $("*", document.body).mousemove(function(e){
      $('#mpos').html(e.pageX +', '+ e.pageY);
      e.stopPropagation();
      var domEl = $(this).get(0);

      $('#elem').html(domEl.tagName);
      $('#ide').html(domEl.id);
    });
 });

But I want it to work also inside an iFrame. If I try now, it only displays the the id and the element name of the iFrame.

Thanks in advance!

Answer 1

It's because the page only sees the iframe as a single element. If you want to select individual elements in the iframe you'll need to replicate the script on the page inside the iframe. But you won't be able to pass this up to the parent page AFAIK.

If you have control over the iframe and its content then you'd be better off putting the content directly into the parent document and using the CSS rule overflow: scroll.

Answer 2

Try this:

var refToIframe = frames[0] == frames['my_frame_name'] == document.getElementById('my_frame_id').contentWindow

Now take it from here

Please note that if you are using a iframe from a cross domain there is a same origin policy please see:

access a cross domain iframe content or events