jQuery Mobile弹出窗口没有打开.popup('open')

Question

我试图使用jQuery Mobile 1.3.1的弹出窗口在登录凭据为假时警告用户.我从jquerymobile的文档开始使用基本模板,但我无法$('#popupBasic').popup('open');使用它如果我以这种方式使用它;

     <div data-role="page">


        <div data-role="header" data-tap-toggle="false">
        </div><!-- /header -->

        <div data-role="content">

            <a href="#popupBasic" data-rel="popup">Tooltip</a>
            <div data-role="popup" id="popupBasic">I will change this text dynamically if this popup works</div>


        </div><!-- /content -->
    </div><!-- /page -->

单击Tooltip链接时效果很好.但在我的情况下,没有任何点击,所以我正在尝试这个;

                if(retVal){
                    $.mobile.changePage('index');
                }
                else{                    
                    $('#popupBasic').popup();
                    $('#popupBasic').popup("open");
                }

这是在我的ajax登录函数进行回调之后,所以如果没有任何错误,则retVal为true,如果存在则为false(并且此时我试图显示弹出窗口).顺便说一下,我所有的js部分都在

 $(document).on('pageinit', function(){});

所以我等到jquerymobile为页面做好准备.

当我这样做时,会在桌面浏览器链接更改上发生什么

http://localhost/login#&ui-state=dialog

但没有显示弹出窗口.经过一些刷新和缓存后,它开始显示.在iOS上同样的事情也发生了但是在Android上有时它会改变链接,有时它不会.

如果有人能帮我解决这个问题,我会很高兴.提前致谢.

Answer 1

那是因为当pageinit被解雇时,poupup尚未准备好进行操作.您需要使用pageshow弹出窗口打开.这是你做的:

• 进入ajax呼叫pageinit.将数据存储data在页面的属性中.
• 然后,在pageshow事件中,从数据中获取if并按照您想要的方式操作它,然后打开弹出窗口.

这是代码:

$(document).on({
    "pageinit": function () {
        alert("pageinit");
        //$("#popupBasic").popup('open'); will throw error here because the page is not ready yet
        //simulate ajax call here
        //data recieved from ajax - might be an array, anything
        var a = Math.random();
        //use this to transfer data betwene events
        $(this).data("fromAjax", a);
    },
    //open popup here
    "pageshow": function () {
        alert("pageshow");
        //using stored data in popup
        $("#popupBasic p").html("Random : " + $(this).data("fromAjax"));
        //open popup
        $("#popupBasic").popup('open');
    }
}, "#page1");

这是一个演示:http://jsfiddle.net/hungerpain/MvwBU/