89042

Replacing HTML within an iframe jquery

Question:

I have an iframed page and I'm trying to replace the only

within the iframe so that it links to a specific url

Here's my code:

$("#custom-iframe").contents().find("p").replaceWith("

<a href='http://www.myurl.com'>blah blah blah.</a>

");

What am I doing wrong? A note: I'm working within a CMS, however I do have access to the head and body tags, and I'm able to add scripts where I please.

Answer1:

Here is the issue: You loaded some url in an iframe. <br /> <iframe src="http://someurl.com"></iframe> <br /> But loading url takes some time, browser has to send request and receive response and display the response in the iframe element.<br /> But javascript does not wait for the response, it attaches a listener to the load event of the request and moves to execute the next line. So when your code is getting executed, the iframe element might be empty because the response for the iframe src url has not arrived.<br /> The correct way to handle this is:

$("#custom-iframe").on('load',function() { $(this).contents().find("p").replaceWith("

<a href='http://www.myurl.com'>blah blah blah.</a>

"); });

Theoretically this should work because when load event fires then loading of url has been completed and all the elements of the external page is available.<br /> But one more thing to keep in mind is : <br /> For security reasons browsers does not allow modifying an external page loaded in an iframe when protocol and domain of the parent pageurl and iframe pageurl differ.

You might see this kind of error in console:<br /> Uncaught SecurityError: Failed to read the 'contentDocument' property from 'HTMLIFrameElement': Blocked a frame with origin "<a href="http://localhost:63342" rel="nofollow">http://localhost:63342</a>" from accessing a frame with origin "<a href="http://someurl.com" rel="nofollow">http://someurl.com</a>". Protocols, domains, and ports must match.

Recommend

  • Call URL before closing of Browser Window [duplicate]
  • window.open with target '_blank' opens a new browser window
  • How can I get the django allauth signup page to show up without being at the /accounts/login url?
  • jQuery - events won't fire for dynamically created tab elements
  • MySQL multiple IN conditions to subquery with same table
  • python: forcing relative imports to search from script file
  • Is it possible to get the word under the mouse cursor in a ``?
  • google maps autocomplete bounces back already cleared text …odd…odd…odd
  • Python 3.2.2, error(scripts to exe)
  • BeautifulSoup difference between findAll and findChildren
  • NHibernate manually control fetching
  • Why isn't obj.style.left = “200px”; working in this code?
  • Tell Git to stop prompting me for conflicts when none really exist?
  • Best way to dynamically load an xml configuration file into a Flex4/Flash movie at runtime?
  • How to view images from protected folder with php?
  • Alternative To body {overflow:scroll;} That Will Prevent Page Jostling/Wriggling?
  • Display images in Django
  • JQuery Internet Explorer and ajaxstop
  • Test if a set exists before trying to drop it
  • Play WS (2.2.1): post/put large request
  • Jquery UI tool tip close icon
  • How to delay loading a property with linq to sql external mapping?
  • Ajax Loaded meta Tags
  • Cannot connect to cassandra from Spark
  • Display issues when we change from one jquery mobile page to another in firefox
  • Different response to non-authenticated users and AJAX calls
  • Resize panoramic image to fixed size
  • Arrow is showed instead of the material design version hamburger icon. Why doesn't syncState in
  • Importing jscolor library in angular 2
  • Warning: Can't call setState (or forceUpdate) on an unmounted component
  • Circular dependency while pushing http interceptor
  • Data Validation Drop Down Box Arrow Disappearing
  • File upload with ng-file-upload throwing error
  • AngularJs get employee from factory
  • Free memory of cv::Mat loaded using FileStorage API
  • How to set the response of a form post action to a iframe source?
  • Java static initializers and reflection
  • Change div Background jquery
  • Append folder name and increment by 1 using batch script
  • How to Embed XSL into XML