如何通过编程方式打开jQuery Mobile弹出窗口并在5秒后关闭它

Question

我希望能够通过编程方式打开一个 jQuery Mobile 弹出框，然后在几秒钟后关闭它，这是我的代码：

有什么问题吗，因为我没有得到想要展示的内容。

$( "#p" ).popup( "open" ); 
setTimeout( function(){ $( "#p" ).popup( "close" ); }, 5000 );

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.js"></script>

<div data-role="popup" id="p" data-position-to="window" data-transition="turn"><p>This is a completely basic popup, no options set.</p></div>

JSFIDDLE DEMO

- Yasser B.

---

您的闭合 p 标签存在语法错误，请将其更改为 </p>。http://jsfiddle.net/m3kkpLtj/2/ - AmmarCSE

谢谢，但是问题依旧，它没有显示弹出窗口5秒钟。 - Yasser B.

请再次检查fiddle链接。我不小心展示了旧的链接。 - AmmarCSE

抱歉，请尝试这个链接：http://jsfiddle.net/m3kkpLtj/4/ - AmmarCSE

总是一样的事情，我的朋友。 - Yasser B.

Answer 1

确保你的代码位于页面事件处理程序（如pagecreate）中，以便jQM已初始化弹出窗口小部件：

<div data-role="page" id="page1">
     <div data-role="header">
        <h1>My page</h1> 
    </div>  
    <div role="main" class="ui-content">
        <button id="btnpopup">Show Dynamic Popup</button>
    </div> 

    <div data-role="popup" id="p" data-position-to="window" data-transition="turn"><p>This is a completely basic popup, no options set.</p></div>
</div>  

$(document).on("pagecreate","#page1", function(){ 
    $("#btnpopup").on("click", function(){
        $("#p").popup("open"); 
        setTimeout(function(){  $("#p").popup("close"); }, 5000);
    });
});

操作演示：DEMO

- ezanker

Answer 2

实际上很简单：

 $("#chatWindow").popup("open");

- Amir