Deteck click into iframe in html

Question

How to know when click into iframe in html? because i want to close the dropdown component when click into iframe.

I searched by google, there is a solution using window.blur, but this method isn't standard.

Any helps are appreciate, thanks!

Answer 1

You may be able to do this with Javascript. The following question covers some methods on how you might implement an OnClick() method for iframes: Adding click event handler to iframe

From there, you could probably have the function go ahead and close the dropdown.

Without knowing more about your code, we can only really suggest general solutions.

Answer 2

I don't think there is a direct way to get a click on iframe in javascript. But there is way around for it. What we can instead do is track if the user hovers over the iframe and using $(window).blur() we can know if the focus has shifted from current window i.e. the webpage to iframe embedded. Focus shift will mean that user has clicked inside the iframe. Once we capture $(window).blur(), we can toggle dropdown state.

var iframeHover;
$('iframe').hover(function() {
  iframeHover = true;
}, function() {
  iframeHover = false;
});
$(window).blur(function() {
  if (iframeHover)
    $("#dLabel").dropdown('toggle');
});

Working Plnkr is: Plnkr