当登录凭据为假时,我正试图使用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为true,如果有错误,则为false(此时我正试图显示弹出窗口)。顺便说一句,我所有的js部分都在中
$(document).on('pageinit', function(){});
所以我一直等到jquerymobile为页面做好准备。
当我这样做时,会发生什么是在桌面浏览器上链接更改为
http://localhost/login#&ui-state=dialog
但没有显示弹出窗口。经过一些刷新和缓存后,它开始显示。在iOS上也会发生同样的事情,但在android上,有时它会更改链接,有时则不会。
如果有人能帮我解决这个问题,我会非常高兴。提前谢谢。
这是因为当pageinit
被激发时,poupup还没有准备好进行操作。您需要使用pageshow
来打开弹出窗口。以下是您的操作:
- 在
pageinit
中进行ajax调用。将数据存储在页面的CCD_ 5属性中 - 然后,在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/