Find out when the window.location.href of an iframe has changed with javascript (jquery)

Question

The question sums it up really...

I have a parent page with a child iframe,

How do you find out when the location of the iframe has changed, i.e. a user has clicked on a link in the iframe and the iframe is navigating to another page

I know I can bind to the onload event of the iframe like so

$("#theIframe").load(function(){
  //Do something
}) 

But by then it's too late... the page has already loaded...

Basically, I need to find out as soon a link is clicked or form is submitted, or whatever causes the location of the iframe to change...

It does not have to work in IE, but all the better if it does... and it does not have to be jquery either...

Thanks in advance...

Answer 1

Try the

onbeforeunload

event on the body of the child document. It's supported by all major browsers.

Answer 2

topic is old, however, this code should help

$("#theIframe").bind('DOMAttrModified', function(e) {

console.log(e);
});

more details about DOM events here (wiki)