Диалоговое окно JQuery mobile без изменения страницы

Question

Мне нужно отображать динамические всплывающие окна в приложении phonegap. Я создал динамические всплывающие окна с использованием JQuery mobile и javascript, но всплывающие окна имеют белый фон во всем приложении. Пожалуйста, помогите мне получить это в правильной форме. Html код:

<div id="popupMsgPage" data-role="popup" data-close-btn="right" data-theme="c" data-overlay-theme="c"> 
     <div data-role="header" data-position="fixed" > 
      <h1 id="popup-head">Delete Page?</h1> 
     </div> 
     <div role="main" class="ui-content"> 
      <h3 class="ui-title" id="popup-title">Are you sure you want to delete this page?</h3> 
      <p id="popup-content">This action cannot be undone.</p> 
      <a href="#" data-rel="back" data-rel-count="1" data-role="button" >Continue</a> 
     </div> 

Jquery код:

function show(head, title, msg) { 
     debugger; 
     head = head ? head : ""; 
     title = title ? title : ""; 
     msg = msg ? msg : ""; 
     jPages["popupMsg"].find("#popup-head").html(head); 
     jPages["popupMsg"].find("#popup-title").html(title); 
     jPages["popupMsg"].find("#popup-content").html(msg); 
     $.mobile.changePage("#popupMsgPage", { 
      role: "dialog" 

     }); 

Answer 1

Я думаю, что вы путаете всплывающий виджет и диалоговых страниц. Если вы не хотите, чтобы изменить страницу, используйте всплывающий виджет, как это:

function show(head, title, msg) { 
    head = head ? head : ""; 
    title = title ? title : ""; 
    msg = msg ? msg : ""; 
    $("#popupMsgPage").find("#popup-head").html(head); 
    $("#popupMsgPage").find("#popup-title").html(title); 
    $("#popupMsgPage").find("#popup-content").html(msg); 

    $("#popupMsgPage").popup("open"); 
} 

Рабочей DEMO