Javascript 当链接到from标头时，jQuery mobile弹出窗口不显示

我正在尝试使用jQuery mobile创建一个网页，我的网站的一部分包括一个登录功能，我正在尝试在页面上的弹出窗口中显示登录表单。链接到弹出窗口的按钮将位于页面的标题中

我的问题是，当我单击登录按钮时，弹出窗口不显示：/

我试图从

div

中删除

ui-selectmenu-hidden

类，但这导致页面加载后弹出窗口显示时没有jQuery样式

我知道我的代码在没有

页面

或

标题

数据角色的情况下工作，因为我在没有这些

div的另一个文档上测试了准确的代码

下面是给我带来问题的代码：

<div data-role="page">
    <div data-role="header">
        <h1>Hello World!</h1>
        <a href="#popupLogin" data-rel="popup" data-position-to="window">Open Popup</a>
    </div>
</div>

<div data-role="popup" id="popupLogin" data-theme="b" class="ui-popup-container ui-selectmenu-hidden popups" data-overlay-theme="a">
    <form id="loginForm">
        <input type="text" placeholder="Username..." />
        <input type="text" placeholder="Password..." />
        <input type="button" value="Login" data-theme="b" />
        <p>New to The Social Network?</p>
        <input type="button" value="Register here" />
    </form>
</div>


你好，世界！
社交网络新手


这里的任何帮助都将不胜感激。很可能我在某个地方犯了一个愚蠢的错误，但就我的一生而言，我找不到它。
如果只能从这一页访问弹出窗口。将弹出div移到与页眉/内容/页脚相同级别的data role=“page”div中

如果要从多个页面访问登录表单，请保持标记不变，但要在文档上添加脚本，以便初始化小部件并增强内容：

$(function(){
    $( "#popupLogin" ).enhanceWithin().popup();
});