How to open jQuery Mobile popup programmatically and close it after 5 seconds

Question

I want to open the jQuery Mobile popup programmatically, and then close it after a few seconds, here is my code:

something is wrong because i don't get what i want to show

$( "#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

Answer 1

Make sure your code is inside the page event handler, such as pagecreate, so that jQM initializes the popup widget:

 <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); }); }); 

Work DEMO

Answer 2

really simple:

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