Funzione JQuery Mobile Pageshow

Question

Sto costruendo una webapp utilizzando il framework jqm e sto tentando di utilizzare la funzione pageshow quando si include un widget jQuery, k3dcarousel. Nella pagina in questione, ho il mio script sotto il data-role="page" div,

$("#page-about").live(
    "pageshow", 
    function (event) { 
     $('#k3dCarousel_portrait').k3dCarousel(); 
    } 
); 

Sembra che ho bisogno di fare clic sul mio link due volte per ottenere la funzione di JS per caricare, che mi fanno pensare che sto usando questo funziona male Inoltre, se non utilizzo la funzione sotto la funzione pageshow, lo script verrà caricato più volte se faccio clic su di nuovo e poi clic di nuovo sul collegamento.

Sto utilizzando la logica pageshow errata? C'è un modo migliore per ottenere ciò che sto cercando di fare: AJAX questa pagina nel mio framework mobile.

Capisco che questa è una domanda piuttosto specifica, ma si spera che ci sia una risposta generica a questo, poiché mi sembra che questo possa accadere a qualsiasi widget.

Qualsiasi aiuto è molto apprezzato, posso incollare altro codice se questo aiuta.

Grazie per il vostro tempo.

Answer 1

Poiché si sta vincolando all'evento pageshow, la funzione anonima verrà attivata ogni volta che si visualizza la pagina. Se si desidera solo per chiamare il codice a prima vista della pagina allora o legarsi ai pagecreate/pageinit eventi o verificare l'esistenza del k3dCarousel nel codice pageshow:

$("#page-about").live(
    "pageshow", 
    function (event) { 
     //check for the existence of HTML within the container element 
     if ($('#k3dCarousel_portrait').html().length == 0) { 
      $('#k3dCarousel_portrait').k3dCarousel(); 
     } 
    } 
); 

Ecco una spiegazione di tutti i jQuery Eventi specifici per cellulari: http://jquerymobile.com/demos/1.0rc3/docs/api/events.html