Get click event from iframe with jquery

Question

How can I get click event from iframe div in my web page where i hade placed iframe using jquery?

Answer 1

Use jQuery contents to interact with iframe contents.

var frame = $('<iframe />').appendTo('body');  // create the iframe and append it to the body
var frameBody = frame.contents().find('body'); // grab the body node
frameBody.append('<div />');                   // add a div
frameBody.find('div');                         // retrieve the div

If you are loading the iframe from a url make sure you adhere to the same-origin policy, and wait for the iframe to load:

frame.load(function(){
    var frameBody = frame.contents().find('body');
    frameBody.find('div').click(function(){
        // here is the iframe div click callback
    }); 
});

Answer 2

This may help you @Valisimo. This is work in internal domain only.

$(document).ready(function(e) {
    // here , I write <h2> HTML tags to try.

    $('#frame').contents().find('h2').click(function(){
        $('#frame').contents().find('h2').toggle(1000);
    })
});