1

I am attempting to create some functionality which will get and set the document of an iframe. I have been unsucessful at performing this with jquery.

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js" ></script></head>
<body>
<iframe sandbox="allow-same-origin allow-scripts" id='a' height="700" width="700" src="http://localhost:8181/website"></iframe> 
<iframe sandbox="allow-same-origin allow-scripts" id='b' height="700" width="700" src="http://localhost:8181/website"></iframe> 
</body>
</html>

When the page loads I need to navigate around in iframe a. At which point I will use javascript or jquery to take the doucment of A and replace B's document with it. Is this even possible? I don't necessarily need to use iframes if there are other options.

Scenario:

1. Page loads, iframe a & b are rendered
2. User navigates inside iframe A to different pages
**below this is functionality I cannot figure out
3. User clicks button to take DOM from iframe a and replace the DOM for Iframe b

This will essentially set the content of iframe b to be where the user had navigated in iframe a

user3032973
  • 415
  • 2
  • 8
  • 26

1 Answers1

1

There is a question about jquery and iframe.

The .contents() method can be used to get the content document of an iframe, if the iframe is on the same domain as the main page.

This should work:

var theHtmlStringToSet = $('#frameA').contents().find('body').html();
$('#frameB').contents().find('body').html(theHtmlStringToSet);
Community
  • 1
  • 1
Mavlarn
  • 3,807
  • 2
  • 37
  • 57