Question

This is my code. I am trying to load a website in a iframe. When the website is loaded, i would like to click in the iframe to select the div id (where i clicked)

 <iframe name="frameID" id="frameID" src="http://www.test.com" style="width:100%;height:400px;"></iframe>

$(document).ready(function(){
$('#frameID').load(function(){


    $('#frameID').contents().bind("click", function () {
        var a = $(this).id;
        alert (a);
        return false;
    });
});

});

For example, if i clicked in the footer of the website loaded in the iframe, i would like to display the div id “footer”.

However, i am unable to do so, it keep returning me undefined.

Answer 1

You could try

$('#frameID').contents().find('body').on("click", "div",  function () {
    var a = this.id;
    alert (a);
    return false;
});