jQuery移动弹出对话框：无法读取未定义的属性“ is”

Question

I am trying to open dialog box using jquery. I have followed instruction using link: http://demos.jquerymobile.com/1.2.0/docs/pages/popup/index.html

code looks like: Dialog

    <div data-role="popup" id="popupDialog" data-overlay-theme="a" data-theme="c" style="max-width:400px;" class="ui-corner-all">
        <div data-role="header" data-theme="a" class="ui-corner-top">
            <h1>Delete Page?</h1>
        </div>
        <div data-role="content" data-theme="d" class="ui-corner-bottom ui-content">
            <h3 class="ui-title">Are you sure you want to delete this page?</h3>
            <p>This action cannot be undone.</p>
            <a href="#" data-role="button" data-inline="true" data-rel="back" data-theme="c">Cancel</a>
            <a href="#" data-role="button" data-inline="true" data-rel="back" data-transition="flow" data-theme="b">Delete</a>
        </div>
    </div>

on jquery ready function, trying to open it through code: $("#popupDialog").popup(); $("#popupDialog").popup("open");

getting error

Not sure what is wrong and can not find any help on this!!!

Answer 1

Open the popup on the jQM pageshow event not the jQuery ready event:

API: http://api.jquerymobile.com/1.3/pageshow/

$(document).on("pageshow","#page1", function(){ 
  $("#popupDialog").popup("open");
});  

DEMO