$（窗口）.blur事件影响的iFrame($(window).blur event affecti

我希望用户离开我的页面时，检测（例如打开一个新标签），所以我可以停止倒计时。我做到了使用：

$(window).blur(function() {
 //stop countdown
});

但是我有一个I帧我的网页内，当用户点击它，但我不希望上述事件时，有人点击的Iframe执行倒计时也将停止。

任何的想法？

更新，我想多一点，在此基础上的答案上点击iframe的事件？：

iframeDoc = $('iframe').contents().get(0);
$(iframeDoc).click(function(){
   //maybe remove blur event?
});

更新：蒂姆·B液的工作：

$(window).blur(function () {
// check focus
if ($('iframe').is(':focus')) {
    // dont stop countdown
}
else {
    // stop countdown
}                
});

现在，我必须从每一个I帧模糊事件被称为时间删除焦点，否则倒计时不会，如果用户聚焦的iFrame前后发生了改变制表位。我试着像这样使用上述条件：

if ($('iframe').is(':focus')) {
    // dont stop countdown
    $("iframe").blur()
    $(window).focus();
}

但它没有工作。任何的想法？

Answer 1:

一个解决办法是检查的iframe具有焦点，然后不停止计时器。例如

$(window).blur(function () {
    // check focus
    if ($('iframe').is(':focus')) {
        // dont stop countdown
    }
    else {
        // stop countdown
    }                
});

现在，这样的工作，但是如果你的iframe具有焦点，当用户更改标签，倒计时不会停止。所以在这种情况下，你需要想到的是优雅的解决方案的移动焦点从之前的iframe路程。举例来说，如果用户点击iframe中，内在地移动焦点回到父窗口。

编辑-更新的答案，包括额外的iframe功能

好了，所以我一直在玩有关与此。现在我不知道你有你的iframe中哪些内容，但你可以添加一些代码到这个时候点击它基本上把焦点回到对象的父窗口内。例如

在您的iFrame

<script>
    $(function () {
        $(document).click(function () {
            // call parent function to set focus
            parent.setFocus();
        });
    });
</script>

在你的主页

<script>

    function setFocus() {
        // focus on an element on your page.
        $('an-element-on-your-page').focus();
    }

    $(function () {

        $(window).focus(function (e) {
            // bind the blur event
            setBindingEvent();
        });

        var setBindingEvent = function () {
            // unbind
            $(window).unbind('blur');
            $(window).blur(function () {
                // check focus
                if ($('iframe').is(':focus')) {
                    // unbind the blur event
                    $(window).unbind('blur');
                }  
                else {
                    // stop countdown
                }                
            });
        };

        setBindingEvent();

    });
</script>

这将允许您点击iframe中，设置焦点回到主页面，然后停止倒计时。

Answer 2:

由于iframe的隔绝，点击里面的算作父模糊。如果iframe的内容可以使用Ajax带来的，这将是一个更好的选择。

Answer 3:

我也有同样的问题。在我的情况，我还没有通过CMS访问IFRAME页面及其负载，我不能改变所有的I帧的。我定时器计数的setInterval（）和时间间隔内，我检查的iFrame。

 const focus = function() { // timer start isBlured = 0; }; const blur = function() { // timer stop isBlured = 1; } window.addEventListener('focus', focus); window.addEventListener('blur', blur); function intervalFunction() { var activeELM = document.activeElement.tagName; if (isBlured == 0 || activeELM == "IFRAME"){ // dont stop countdown var stopIframe = $('iframe').blur(); } }

文章来源: $(window).blur event affecting Iframe