7

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>
user198989
  • 4,574
  • 19
  • 66
  • 95

3 Answers3

11

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');});
Willem
  • 5,364
  • 2
  • 23
  • 44
5
$iframe = $( document.getElementById("myiframe").contentWindow.document );

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

http://jsfiddle.net/cRDjV/81/

r043v
  • 1,859
  • 1
  • 15
  • 25
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

Community
  • 1
  • 1
Farkie
  • 3,307
  • 2
  • 22
  • 33