Popup when iframe redirect top page

Question

I am working on a payment website, which needs to integrate a 3rd party website inside an iframe. However, at some point, the user can click a button inside the iframe, which redirects the parent window to another URL. I cannot touch the 3rd party code.

Is it possible to capture this URL the parent window is being redirected to, stop this redirection, and pop up another window for that URL?

Thanks for any help.

Answer 1

You will be able to detect when the iframe's url changes , but you will not be able to look at what the new url is. That may be just enough. If the user clicks something in the iframe, and the iframe changes url, then you can detect that and redirect the parent window.

Plain javascript solution:

<iframe
  src="https://target.com/page"
  onload="alert('iframe has loaded or changed')">
</iframe>

jQuery solution:

<iframe class="target-iframe" src="https://target.com/page"></iframe>

$(document).on('load', '.target-iframe', function () {
  alert('iframe has loaded or changed')
});