How to Detect iFrame Source Changes from the Parent Page?

How to Detect iFrame Source Changes on Parent Page

When you lack control over the content within an iFrame, it can be challenging to monitor changes to its source URL. However, there are techniques you can employ to detect these events via the parent page.

One option is to utilize the onLoad event. By adding an onLoad attribute to your iFrame element, you can specify a function to execute whenever the iFrame's source changes. For example:

<code class="html"><iframe src="http://www.google.com/" onLoad="alert('Test');"></iframe></code>

This setup will trigger the alert every time the location within the iFrame is modified. It functions in most modern browsers, but may not work in older browsers (e.g., IE5, early Opera).

Alternatively, if the iFrame is displaying a page within the same domain as the parent, you can access the iFrame's location through contentWindow.location. This allows you to monitor changes directly:

<code class="html"><iframe src="/test.html" onLoad="alert(this.contentWindow.location);"></iframe></code>

These approaches provide reliable ways to detect iFrame source changes, eliminating the need for hacky solutions like interval tests.

The above is the detailed content of How to Detect iFrame Source Changes from the Parent Page?. For more information, please follow other related articles on the PHP Chinese website!