jquery-mobile - pageinit 上的 jQuery 移动弹出窗口

Question

我希望在页面加载后立即打开一个弹出窗口，但似乎被旋转轮卡住了。

这是一个提琴手来演示这个问题，任何帮助都将不胜感激。

http://jsfiddle.net/Ohpyx/UGfXG/

我正在使用的代码是：

$(document).live('pageinit',function(event){
    $('#popupBasic').popup('open');
})​

Answer 1

这对我有用：

$(document).on('pageinit', '.ui-page',function(event){
    setTimeout(function () {
        $('#popupBasic').popup('open');
    }, 0);//Note the comment below from @Taifun.
})​

您有一个竞争条件，这会将弹出代码放在队列的末尾。

这是一个演示：http: //jsfiddle.net/UGfXG/6/

注意：我替换.live()为.on()（委托风格），因为从 jQuery 1.7 开始，前者已被贬低。

Answer 2

.popup('open')需要，在事件$.mobile.activePage之后设置。pageinit该pagechange事件似乎更适合弹出窗口。

这对我有用：

$(document).on('pagechange',function(event){
    $('#popupBasic').popup('open');
})​

如果您只想在第一次加载时使用它，请使用.one：

$(document).one('pagechange',function(event){
    $('#popupBasic').popup('open');
})​

见https://github.com/jquery/jquery-mobile/issues/3384