Comment ajouter un événement de clic à un iframe avec JQuery

Question

J'ai un iframe sur une page, provenant d'un tiers (une annonce). Je souhaite déclencher un événement de clic lorsque l'utilisateur clique sur l'iframe (pour enregistrer des statistiques internes). Quelque chose comme:

 $('#iframe_id').click(function() {
    //run function that records clicks
});
 

..basé sur HTML de:

 <iframe id="iframe_id" src="http://something.com"></iframe>
 

Je n'arrive pas à obtenir une variation de ce travail. Pensées?

Answer 1

Il n'y a pas d'événement 'onclick' pour un iframe, mais vous pouvez essayer d'attraper l'événement click du document dans l'iframe:

 document.getElementById("iframe_id").contentWindow.document.body.onclick = 
function() {
  alert("iframe clicked");
}
 

EDIT Bien que cela ne résolve pas votre problème de cross site, FYI jQuery a été mis à jour pour fonctionner correctement avec iFrames :

 $('#iframe_id').bind('click', function(event) { });
 

Answer 2

Essayez d’utiliser ceci: plugin iframeTracker jQuery , comme ceci:

 jQuery(document).ready(function($){
    $('.iframe_wrap iframe').iframeTracker({
        blurCallback: function(){
            // Do something when iframe is clicked (like firing an XHR request)
        }
    });
});
 

Answer 3

Aucune des réponses suggérées n'a fonctionné pour moi. J'ai résolu un cas similaire de la manière suivante:

 <a href="http://my-target-url.com" id="iframe-wrapper"></a>
<iframe id="iframe_id" src="http://something.com" allowtrancparency="yes" frameborder="o"></iframe>
 

Le css (bien sûr, le positionnement exact devrait changer en fonction des exigences de l'application):

 #iframe-wrapper, iframe#iframe_id {
  width: 162px;
  border: none;
  height: 21px;
  position: absolute;
  top: 3px;
  left: 398px;
}
#alerts-wrapper {
  z-index: 1000;
}
 

Bien sûr, vous pouvez maintenant capturer n’importe quel événement sur l’iframe-wrapper.

Answer 4

Si vous êtes d'accord avec l'hypothèse que vous avez cliqué sur iFrame, si l'utilisateur a déplacé la souris dessus, vous pouvez utiliser un logiciel comme celui-ci. Comment capturer l'événement click avec jQuery pour iframe?