5

我正在尝试使用 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 -->

当我单击工具提示链接时，它运行良好。但就我而言，没有任何点击，所以我正在尝试这个；

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

这是在我的 ajax 登录函数进行回调之后，因此如果没有任何错误，则 retVal 为真，如果有则为假（此时我正在尝试显示弹出窗口）。顺便说一句，我所有的 js 部分都在

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

所以我等到 jquerymobile 准备好页面。

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

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

但不显示弹出窗口。经过一些刷新和缓存后，它开始显示。在 iOS 上也会发生同样的事情，但在 android 上有时它会更改链接，有时它不会。

如果有人可以帮助我解决这个问题，我会非常高兴。提前致谢。

4

1 回答 1

9

那是因为当pageinit被触发时，弹出框还没有准备好进行操作。您需要使用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/

于 2013-07-10T03:14:14.880 回答