Question

160

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

rated 0 times [ 163] [ 3] / answers: 1 / hits: 33405 / 9 Years ago, tue, may 12, 2015, 12:00:00

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

is there anything wrong, cause I'm not getting 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

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

lexusg

Add To Favorites

Follow

Total Points: 718

Total Questions: 106

Total Answers: 104

Location: Palestine

Member since Tue, Jul 20, 2021

3 Years ago

answered 9 Years ago darennevina · Accepted Answer

Make sure your code is within a page event handler like pagecreate so that jQM has initialized 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);

    });

});

Working DEMO