JQuery 모바일에 팝업 창 표시

Question

JQuery 모바일을 사용하고 있는데 팝업 창이 표시되지만 팝업이 표시되지 않습니다. 여기에 지금까지 할 시도한 것입니다 : 당신이 몸이나 pageContainer에 추가하는 경우

document.addEventListener("menubutton", function(){ 
    var template = $("<div data-role='popup' id='menu-option' " 
     + "data-overlay-theme='a'>" 
     + "<ul data-role='listview' data-inset='true' " 
     + "style='min-width:210px;' data-theme='d'>" 
     + "<li data-role='divider' data-theme='e'>Options</li>" 
     + "<li><a>Setting</a></li>" 
     + "<li><a>Refresh</a></li>" 
     + "<li><a>Help</a></li>" 
     + "<li><a>about</a></li>" 
     + "<li><a id='exit-app'>Exit App</a></li>" 
     + "</ul> </div>"); 


    template.appendTo($.mobile.pageContainer);      
    template.popup(); 
    template.popup('open'); 

    }, false); 

Answer 1

팝업 DIV이 페이지 DIV에 추가해야한다, 그것은 늘 작동합니다. 또한 을 열기 전에을 만들어야합니다.

// append it to active page or a specifiC#page 
template.appendTo($.mobile.activePage); 

// create it and then open it 
$("[data-role=popup]").popup().trigger("create").popup('open'); 

Demo