Venelin
Venelin

Reputation: 3308

Trying to click a button inside an Iframe with jQuery

Guys i'm trying to click a button inside an iframe with jQuery.

So here is the function i've created:

<script type="text/javascript">
     function ClickTheButton()
     {
        $('#InnerIframe').contents().find('#SuperWebF1').trigger( "click" );
     }
</script>

Here is the HTML code of the button when it is called by the iframe:

<button type="button"  id="SuperWebF1" title="Continue" class="button">Continue</button>

Here is the HTML code of the iframe:

<div id="OutDiv" class="outerdiv">
    <iframe src="http://beta.sportsdirect.bg/checkout/onepage/" id="InnerIframe" class="FrameCSS" scrolling="no"></iframe>
</div>

When i run ClickTheButton() in the Chrome's Console i got this error: TypeError: Cannot read property 'contents' of null

And the button is not clicked when i execute this function but it have to be...

So guys, where is my mistake? How can i click the button inside the iframe?

Thanks in advance!

Upvotes: 0

Views: 4300

Answers (1)

Jarek Pi&#243;rkowski
Jarek Pi&#243;rkowski

Reputation: 648

You cannot access contents of an iframe loaded from a different server than yours. This is for security reasons.

For details see e.g. https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy or http://javascript.info/tutorial/same-origin-security-policy

Upvotes: 3

Related Questions