2012-03-26 18 views
6

Ho un singolo file HTML che è simile al seguente:programmazione aprire una finestra in jQuery Mobile

<div id="myPage" data-role="page"> 
    <div data-role="header"> 
    <a href="#" data-icon="arrow-l" data-iconpos="notext" class="ui-btn-left jqm-home" onclick="backButton_Click();">Back</a> 
    <h1>My App</h1> 
    </div> 

    <div> 
    <input id="saveButton" type="button" value="Save" onclick="doStuff()" /> 
    </div> 

    <script type="text/javascript"> 
    function doStuff() { 
     var updatedText = getUpdatedText(); 
     $("#myMessage", "#myDialog").html(updatedText);      
     $.mobile.changePage("#myDialog", { role: "dialog" });  
    } 
    </script> 
</div> 

<div id="myDialog" data-role="page"> 
    <div id="myMessage"></div> 
    <input id="button1" type="button" value="Button 1" data-theme="b" onclick="someJS1();" /> 
    <input id="button2" type="button" value="Button 2" data-theme="c" onclick="someJS2();" /> 
</div> 

Quando "doStuff()" viene chiamato, voglio impostare un messaggio personalizzato nel testo della mia finestra di dialogo e apro la finestra di dialogo. Per qualche motivo, non sono stato in grado di aprire myDialog. Per la vita di me, non riesco a capire cosa sto sbagliando. Ho rivisto il contenuto postato qui: http://jquerymobile.com/demos/1.0a4.1/docs/pages/docs-pages.html

+1

Oh mio, il tuo link alla documentazione va a una versione che ha circa un anno. Assicurati di utilizzare la versione 1.0 o successiva poiché qualsiasi cosa pre-1.0 era una build di sviluppo. – Jasper

risposta

19

penso che è necessario impostare il ruolo della pagina per dialogo

<div id="myDialog" data-role="dialog"> 
    <div id="myMessage"></div> 
    <input id="button1" type="button" value="Button 1" data-theme="b" onclick="someJS1();" /> 
    <input id="button2" type="button" value="Button 2" data-theme="c" onclick="someJS2();" /> 
</div> 

e quindi aprire la finestra di dialogo con

$.mobile.changePage("#myDialog"); 

See Fiddle http://jsfiddle.net/kYsVp/2/

+3

Se si imposta la finestra di dialogo 'ruolo:" "nell'oggetto di opzione' $ .mobile.changePage() ', sostituisce l'attributo' data-role' effettivo dell'elemento e utilizza il ruolo specificato. Documenti qui: http://jquerymobile.com/demos/1.1.0-rc.1/docs/api/methods.html – Jasper

Problemi correlati