admin管理员组

文章数量:1315252

I am using a hosted CMS that renders an iFrame within another iFrames. These iFrames are loaded from the same domain but since this is a hosted CMS I do not have access to these iFrames directly. Is it possible, using jQuery, to insert HTML content into the body tag of the iFrame with the id of re_contentIframe?

Here is how the code renders on my site:

<div class="editor">
  <iframe id="editorf"  frameborder="0" src="/ForumEditor.aspx?ForumID=2221&TopicID=-1&NoTemplate=False&Internal=False" style="display: inline;">
    <html>
      <head></head>
        <body>
          <!-- CODE -->
            <iframe id="re_contentIframe" frameborder="0" src="javascript:'<html></html>';">
             <html>
              <head></head>
               <body> <!-- THIS IS WHAT I WANT TO TARGET --> </body>
             </html>
            </iframe>
          <!-- CODE -->
      </body>
    </html>
  </iframe>
</div>

I tried using the following code but nothing happens with this code (including no errors):

$(function() {
   $( "#test" ).click(function() {
       $("#re_contentIframe").contents().find("body").html("<p>new HTML content goes here</p>");
   });
});

I am using a hosted CMS that renders an iFrame within another iFrames. These iFrames are loaded from the same domain but since this is a hosted CMS I do not have access to these iFrames directly. Is it possible, using jQuery, to insert HTML content into the body tag of the iFrame with the id of re_contentIframe?

Here is how the code renders on my site:

<div class="editor">
  <iframe id="editorf"  frameborder="0" src="/ForumEditor.aspx?ForumID=2221&TopicID=-1&NoTemplate=False&Internal=False" style="display: inline;">
    <html>
      <head></head>
        <body>
          <!-- CODE -->
            <iframe id="re_contentIframe" frameborder="0" src="javascript:'<html></html>';">
             <html>
              <head></head>
               <body> <!-- THIS IS WHAT I WANT TO TARGET --> </body>
             </html>
            </iframe>
          <!-- CODE -->
      </body>
    </html>
  </iframe>
</div>

I tried using the following code but nothing happens with this code (including no errors):

$(function() {
   $( "#test" ).click(function() {
       $("#re_contentIframe").contents().find("body").html("<p>new HTML content goes here</p>");
   });
});
Share Improve this question edited Oct 15, 2013 at 17:15 L84 asked Oct 15, 2013 at 6:22 L84L84 46.3k59 gold badges181 silver badges259 bronze badges 2
  • 1 Possible duplicate of stackoverflow./questions/5924936/… ? – VJS Commented Oct 15, 2013 at 6:45
  • @VijetaShetty - I do not think so. That is where I found the code I tried. As said above, it isn't working and I am unsure why. – L84 Commented Oct 15, 2013 at 6:54
Add a ment  | 

2 Answers 2

Reset to default 4

The problem is that you are trying to access a nested frame.

The #re_contentIframe frame is nested within #editorf, which is subsequently nested within your document.

Try:

$('#re_contentIframe').contents().find('body').find('#editorf').contents()

Fiddle: http://jsfiddle/8VP4y/3/

haven't checked it ,might help :

var frameObject = document.getElementById('editorf');
var frameContent = frameObject.contentDocument ||
frameObject.contentWindow.document;
var insideIframe = frameContent.getElementById('re_contentIframe');
var insideIframeContent = insideIframeObject.contentDocument ||
insideIframeObject.contentWindow.document;
var $body = $('body',insideIframeContent);
$body.html('<div>contentupdated</div>');

本文标签: javascriptUse jQuery to Insert HTML into an iFrame Body TagStack Overflow