OnClick function doesnt fire on iframe?

Question

I am trying to make click function fire when iframe is being clicked but It doesn't fire. Is it possible to do it ?

$("#iframe").click(function() {
alert("works");
});

<iframe id="iframe" src="http://site.com" scrolling="no"></iframe>

score 10 · Accepted Answer · answered May 28 '13 at 13:21

10

Another solution is to overlay a transparent div and add a click event to that div. Working sample: http://jsfiddle.net/w1ll3m/AxJHH/

<div class="container">
    <iframe src="#url"></iframe>
    <div class="overlay"></div>
</div>

css to position the div.overlay over the iframe:

.container{position:relative;float:left;}
.overlay{top:0;left:0;width:100%;height:100%;position:absolute;}

Add the event:

$('.overlay').click(function(){alert('hello');});

answered May 28 '13 at 13:21

Willem

13

But then you can't interact with the iframe :( – Daniel Cheung Mar 28 '16 at 09:09
if you're only looking for the initial click, you can remove the overlay programmatically afterwards – mic Nov 01 '18 at 06:41

r043v · Answer 2 · 2015-09-02T13:03:37.603

5

$iframe = $( document.getElementById("myiframe").contentWindow.document );

$iframe.find("body").click(function(){
    alert("hey");
});

edited Sep 02 '15 at 13:03

answered May 28 '13 at 13:12

r043v

3

This will only work on authorized sub domains or the same domain, not if the iframe refers do a diffrent domain – Willem D'Haeseleer May 28 '13 at 13:25
hopefully yes :- ) he can only use your overlay solution if iframe differ in domain – r043v May 28 '13 at 13:26
It works, just not with `alert()` inside the anonymous function. Try redirecting the event call to a global function. – Daniel Cheung Mar 28 '16 at 09:11

score 2 · Answer 3 · edited May 23 '17 at 12:31

2

No. You need to do this inside the iFrame, rather than the parent.

You could however, add an EventListener: Adding click event handler to iframe

edited May 23 '17 at 12:31

Community

answered May 28 '13 at 13:11

Farkie

Not totally impossible in some cases to create a script outside the function. – Daniel Cheung Mar 28 '16 at 09:16

3 Answers3