Comment faire pour afficher la page de chargement spinner en jquery mobile

Je suis en train d'afficher la page de chargement spinner à l'aide de code ci-dessous dans jquery mobile 1.3 Android application native, mais ça ne fonctionne pas, quelqu'un peut-il m'aider à ce que le problème est et comment le faire fonctionner

</head>
  <body>
    <div id="createPage" data-role="page">
   <script>
    $("#createPage").on("pageshow", function(event, ui) {
    $mobile.loading('show');
    processCreateBtnAction(); //This takes 5 seconds to complete the operation
    $.mobile.loading('hide');
});
</script>
 <div data-role="header" data-position="fixed"></div>
  • REMARQUE: vous disposez de mobile, plutôt que de $.mobile. Espérons que ce n'est pas votre erreur?
  • oh, je pense que "." a obtenu manqué dans mon code
InformationsquelleAutor srinik | 2013-07-08
  1. 5

    Autres réponses sont bonnes. Personnellement, j'ai un peu différent varition de la même technique de base - créer un assez grand saut dans le Javascript de traitement, que l'INTERFACE utilisateur aura assez de temps pour se redessiner.

    $("#createPage").on("pageshow", function(event, ui) {
    $.mobile.loading('show');
    setTimeout(function(){
        processCreateBtnAction(); //This takes 5 seconds to complete the operation
        $.mobile.loading('hide');
    }, 20);
});

    Cela va créer un 20 millisecondes délai d'attente après le "show" est appelé. Ce qui est assez de temps pour l'INTERFACE utilisateur pour redessiner lui-même avant de l'UC lourd processCreateBtnAction() la fonction est appelée.

    J'ai expérimenté avec des temps différents, et ont constaté que 20 millisecondes est le meilleur délai à utiliser. Certaines personnes tentent d'utiliser 0 ou quelque chose comme ça - qui va travailler sur la plus rapide des appareils. Mais sur un iPad 1 ou quelque chose comme ça qui est assez lent, vous devez disposer d'un délai décent, ou vous pourriez ne pas avoir assez de temps pour l'écran de redessiner.

    • Merci cela a aidé.
    InformationsquelleAutor asgeo1
  2. 0

    Javascript est légèrement différent des autres langages de programmation comme il ne va pas attendre pour les actions au sein de la fonction processCreateBtnAction() pour terminer avant de passer à la ligne suivante, qui est pourquoi votre spinner est caché.

    Une façon de contourner cela est d'utiliser les fonctions de rappel (comme en Javascript, les fonctions peuvent être passés comme des objets). Quelque chose le long des lignes de:

    $("#createPage").on("pageshow", function(event, ui) {
    $mobile.loading('show');
    processCreateBtnAction($.mobile.loading('hide'));
});

function processCreateBtnAction(callback) {
    //Rest of your function here

    callback(); //$.mobile.loading('hide') will be called here.
}
    • Sauf processCreateBtnAction() est en train de faire quelque chose de manière asynchrone (comme son nom l'indique), JS doit être en attente pour la fonction à remplir avant qu'il ne se cache le throbber. Donc, il n'a rien à voir avec du javascript, un langage plus que ce qu'elle fait avec ce qu'il fait dans cette fonction.
    InformationsquelleAutor Kyri Elia
  3. 0

    Essayez ceci à la place de $mobile.loading('show');:

    var interval = setInterval(function () {
        $.mobile.loading('show');
        clearInterval(interval);
    }, 1);
    InformationsquelleAutor dejavu