jQuery Mobile 弹出问题

Question

我才刚刚开始以任何严肃的方式使用新的 jQM 1.2 弹出功能，并且遇到了许多奇怪的问题。我需要从脚本打开弹出窗口，而不是通过 data-rel='popup' 单击。 “简单”，我想 - 只需将数据角色设置为“popup”的弹出元素放入，然后从脚本中将其打开为 element.popup('open')。我尝试这样做只是为了让 jQM 提示

未捕获错误:在初始化之前无法调用弹出窗口上的方法；尝试调用方法“open”

所以我想我根本不会使用数据角色，将元素样式设置为 display:none，然后简单地执行

element.popup().css('display':'block').popup('open') 来自脚本(如果需要)。第一次这样做就像一个魅力。然后，当我尝试重新打开弹出窗口时，没有任何反应 - 没有弹出窗口!我认为这可能与两次初始化弹出窗口有关，所以我将代码更改为

if ('undefined' == typeof(element.data('ppp'))
element.popup().css('display','block').data('ppp',1);

其次是

element.popup('open')

仍然不高兴 - 弹出窗口似乎在关闭后忘记了其数据属性

对此的任何帮助将不胜感激 - 基本上我想做的就是从脚本中多次打开和关闭弹出窗口。

Answer 1

对此有一个非常简单的答案。尝试访问弹出元素以便通过其虚拟类声明(在本例中为 ppp)定位来打开它，将永远不会起作用。如果你想找到一个弹出窗口，你必须给它一个 ID。没有 id，无法进入弹出窗口。一旦您查看 jQM 在看到 data-role='popup' 时生成的代码，这一点就会变得清晰。它会留下一个空的 DIV 标签来代替您原来的弹出窗口定义，其中仅包含

<div>
<!--Placeholder for popupid-->
<div>

在最初定义弹出窗口的页面底部，它放置了两个新的 div

<div class='ui-popup-screen ui-screen-hidden' id='popupid-screen'></div>
<div class='ui-popup-container ui-selectmenu-hidden' id='popupid-popup'>..</div>

最初定义的弹出窗口的所有内容都会移至后一个 div 中。不要为原始弹出窗口提供 id，通过 jQuery 以任何有用的方式访问它的机制就会崩溃。