Обнаружение щелчка внутри IFrame с использованием невидимого div

Я прошел этот пост. Обнаружение Щелкните в Iframe с помощью JavaScript

Но все же, я вижу, что люди делали подобные вещи. Пожалуйста, скажите мне, как мне это сделать.

Один из разработчиков сказал мне:

Вы можете поставить прозрачный DIV поверх IFRAME. Вы устанавливаете размер DIV на тот же размер или больше, чем IFRAME. И с более высоким значением CSS-индекса z-index.

Затем, когда вы нажимаете на IFRAME, DIV получает событие.

Но поскольку мир не совершенен, теперь вы потеряли возможность щелчка внутри IFRAME.

Но я не так хорош с Div's и хочу научиться этому. благодаря

PS Это о перекрестной домене или чужом доменном iframing.

Если я понимаю, что вы спрашиваете здесь:

jsFiddle

// PLACE OVERLAY OVER EACH IFRAME var W=0, H=0, X=0, Y=0; $(".iframe").each(function(i,el){ W = $(el).width(); H = $(el).height(); X = $(el).position().left; Y = $(el).position().top; $(this).after('<div class="overlay" />'); $(this).next('.overlay').css({ width: W, height: H, left: X, top: Y }); }); // TRACK MOUSE POSITIONS (the overlay will prevent clicks on iframe page) var mx = 0, my = 0; $('.overlay').on('mousemove click',function(e){ mx = e.clientX - $(this).position().left; my = e.clientY - $(this).position().top; if(e.type==='click'){ alert('clicked at: X='+mx+' Y='+my) } }); 

Я думаю, что прозрачный div не будет работать, потому что он поймает все события щелчка, а не разложит его на iframe.

Таким образом, единственный обходной путь, который я знаю для отслеживания щелчка по iframe, использует событие размытия. Вы можете использовать iframeTracker jQuery Plugin, чтобы сделать это легко:

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

Проверьте метод .live JQuery.

Он может присоединить обработчик событий к селектору сейчас и в будущем, например, когда контент загружается в div.

http://api.jquery.com/live/