Saltar al contenido
Codif铆ca.me | Desarrollo web | Programaci贸n

C贸mo detectar clicks en iframe

5 septiembre, 2016
stackoverflow

En esta entrada os traigo un pedazo de c贸digo que puede ser 煤til para detectar clicks en iframes.
Lo hace, lo hace, seguro que muchas veces has leido o escuchado que no se puede hacer.

C贸mo puedes ver con este c贸digo lo detectar谩, y as铆 podremos controlar si se hace click en un iframe.

La mayor铆a de las redes de anunciantes que pagan por click utilizan iframes, y con este mini script podemos detectar si se hacen click dentro del iframe.

Esta funci贸n est谩 hecha en javaScript, que tendr谩s que subir y adaptar a tu c贸digo de tu p谩gina web.

 
stackoverflow

El c贸digo lo encontr茅 en la web StackOverflow, despu茅s lo adapt茅 a distintos proyectos, aqu铆 est谩 el c贸digo en bruto, sin adaptar, pero funciona correctamente.

$(window).on('blur',function(e) {    
	if($(this).data('mouseIn') != 'yes')return;
	$('iframe').filter(function(){
		return $(this).data('mouseIn') == 'yes';
	}).trigger('iframeclick');    
});
 
$(window).mouseenter(function(){
	$(this).data('mouseIn', 'yes');
}).mouseleave(function(){
	$(this).data('mouseIn', 'no');
});
 
$('iframe').mouseenter(function(){
	$(this).data('mouseIn', 'yes');
	$(window).data('mouseIn', 'yes');
}).mouseleave(function(){
	$(this).data('mouseIn', null);
});
 
$('iframe').on('iframeclick', function(){
	console.log('Click dentro del iframe');
	$('#result').text('Click dentro del iframe'); 
});
$(window).on('click', function(){
	console.log('Click dentro de la ventana');
	$('#result').text('Click dentro de la ventana'); 
}).blur(function(){
	console.log('window blur');
});
 
$('<input type="text" style="position:absolute;opacity:0;height:0px;width:0px;"/>').appendTo(document.body).blur(function(){
$(window).trigger('blur');
}).focus();

Si quieres ocultar el iframe una vez que se haya hecho click, puedes utilizar esta funci贸n.

$('iframe').on('iframeclick', function(){
            $(this).hide() // Or remove() 
            $('#result').text('Clicked dentro del iframe'); 
        });

Y listo, con esto puedes hacer tu propio “Click Fraud Monitor” XD.

5/5 - (1 voto)