【问题标题】:JQM: popup not closing on timeout?JQM:弹出窗口不关闭超时?
【发布时间】:2013-04-18 09:38:39
【问题描述】:

我已经设法在页面加载时打开一个弹出窗口,但只是在第一次打开该页面时。一旦它打开,我希望它在几秒钟后自行关闭,但我无法做到。

这是我正在使用的代码:

<script type="text/javascript" language="JavaScript">
    $(document).on('pageshow', function (event) {
if (sessionStorage.popUpShown != 'true') {

    $('#strelica').popup('open', {positionTo: '#hitnizbor'});

    sessionStorage.popUpShown = 'true';
    setTimeout(function () {
        $("#strelica").popup("close");
    }, 3000);
}

else{
    alert('already shown the popup');
}

});
</script>

【问题讨论】:

  • 也许你应该考虑将 setTimeout 放在条件之外,就在 on('pagesshow'... 行

标签: javascript html jquery-mobile setinterval jquery-mobile-popup


【解决方案1】:

你的例子应该可以,但我给你做了一个更安全的版本:http://jsfiddle.net/Gajotres/Uauar/

$(document).on('pageshow', '#index', function(){     
    var start = setTimeout(function () {
        $('#strelica').popup('open', {positionTo: '#hitnizbor'});
        clearInterval(start);
    }, 0);    

    var stop = setTimeout(function () {
        $("#strelica").popup("close");
        clearInterval(stop);        
    }, 3000);
});

此代码可用于每个页面事件,而不仅仅是页面显示。如果您希望它只执行一次,请使用 pageinit。

ClearInterval 用于防止不断打开和关闭。如果您还有更多问题,请随时提出。

【讨论】:

  • 谢谢。这行得通。但是,当我从外部页面导航回索引时,它会再次打开弹出窗口。这就是我之前使用 sessionStorage 的原因。如何使它与您的代码一起使用?
  • 如果这个外部页面仍然是您项目的一部分并且您没有阻止使用 ajax 加载经典页面,那么您可以简单地使用 pageinit 而不是 pageshow。在任何其他情况下,使用 sessionStorage。
【解决方案2】:

您正在使用 jquery 插件?我在 jquery 插件 popupjs 中找到了答案:

$('a.popup').popup({
   afterOpen : function(){
     var popup = this;
     setTimeout(function(){
        popup.close();
    }, 2000);
}
});

您可能会错过官方示例。

【讨论】:

  • 看标签,他用的是jQuery mobile。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2012-04-07
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多