J'utilise un JS prometteur pour obtenir de manière asynchrone Obtenir l'emplacement de l'utilisateur à l'intérieur Cependant, modification finalement Il convient de noter que je veux noter que je veux masque le signe de chargement après J'ai essayé de définir "caché" sur true dans un troisième GetLocation () Code>. Et puis je fais une demande Ajax au serveur à l'intérieur de
postlocation () code>.
addlocation_loader Code> "Caché" L'attribut to true ne fonctionne pas, ce qui signifie que l'attribut est correctement défini sur FALSE, mais ne tourne jamais vrai. P>
postlocation () code> est exécuté. p>
() code> déclaration, mais Le panneau ne se présente maintenant jamais. Il semble que les instructions de spectacle et de masque soient rapidement exécutées après l'autre, ce qui est déroutant (lorsque je commenterai l'instruction Hide, le signe est normalement affiché, ce qui signifie que les deux exécutés). P>
getLocation().then(function (pos) {
$('#addlocation_loader').attr('hidden', false); // Show loading sign
return pos;
}).then(function (pos) {
postLocation(pos);
}).then(function () {
$('#addlocation_loader').attr('hidden', true); // Hide loading sign
});
3 Réponses :
Si vous souhaitez masquer le chargeur, vous devez le faire dans le Voici votre code fixe: p> .Chen () code> rappel, car c'est à ce moment-là que la promesse a été résolue. Donc, ce que vous voulez faire est de:
PostLocation () Code> Li>
postlocation () code> (que vous n'avez pas fait dans le code) LI>
Vous voulez dire prop code> et pas
attr code>
@ Alen.toma je n'ai aucune idée de ce que fait cet attribut, ce n'est probablement pas un attribut booléen. Cependant, sans regarder le code complet de OP, il serait faux d'essayer de le changer en Prop code> simplement parce que l'on soupçonne que c'est un attribut booléen / accessoire.
yeh mais il avait un commentaire qui dit // masquer le signe de chargement code> donc je suppose que hes essaye de cacher le chargeur. Pourrait également utiliser
masquer code> et
Afficher code>. Mais je me trompe peut-être
Alterner l'attribut «caché» ressemble à montrant / masquant l'élément. @Terry J'essaie d'essayer d'afficher l'élément après getLocation () code> est exécuté et la masquant après
postlocation () code> finitions, j'ai ajouté plus d'informations à ce sujet dans la question des détails.
@Ahmad getLocation () code> est exécuté immédiatement, afin que vous puissiez simplement montrer le chargeur juste avant cela. Lorsque
getLocation () code> S Promise est résolu, vous appelez ensuite
postlocation () code>. La raison pour laquelle votre code semble exécuter immédiatement est dû au fait que vous n'avez pas retourné la promesse, c'est-à-dire
.Chen () code> est immédiatement résolu;) Voir ma réponse mise à jour.
@Terry La chose est, getLocation () code> attend la saisie de l'utilisateur, donc je veux seulement montrer le signe de chargement après
getLocation () code> est exécuté.
@Ahmad bien. Si tel est le cas, utilisez l'attribut caché dans le premier .Chen () code>. Il éteint le seul problème pourquoi votre code d'origine ne fonctionne pas, car vous n'avez pas revenu
postlocation () code>. Voir ma réponse mise à jour. J'espère que cela aide!
@Terry j'ai essayé de faire ça, mais malheureusement, je me suis malheureusement muni au problème initial qui est le signe de ne pas être montré du tout. Il semble également (lorsque j'arrête l'énoncé masquant le signe) que le signe est affiché presque en même temps lorsque postlocation () code> finitions, ce qui est encore plus déroutant.
Vous utilisez une fonction asynchrone à l'attribut à FALSE. Cela signifie que probablement est exécuté avant p>
Vous pouvez avoir votre chargeur de cache-cache / show en arrière. On dirait que vous avez défini caché à FALSE lorsque l'emplacement est renvoyé et en true lorsque le bouton est enfoncé.
Peut-être que ceci fonctionnerait: P>
$("#add_location_btn").on("click", function() { const $loader = $("#addlocation_loader"); if ($("#code").val().length === 0) { window.alert("Enter a valid code!"); } else { $loader.attr("hidden", false); // Show when requested getLocation() .then(function(pos) { $loader.attr("hidden", true); // Hide when returned postLocation(pos); }); } });
Cela a du sens, mais je veux réellement montrer le signe après avoir obtenu l'emplacement et le cacher après postlocation () code> terminé l'exécution.
Si la ligne finale ne devrait-elle pas être dans un autre
.Chen () code> enchaînant le
postlocation code> promesse? Comme c'est le cas, cela se produit synchrone dès que le bouton clique sur le bouton, il est donc premier i> se cacher, puis montré une fois
getLocation code> a fini - et ne se cache plus jamais caché. [Ou je manque quelque chose?]
Vous pouvez avoir votre chargeur masquage / show en arrière. On dirait que vous définissez
caché code> à
false code> lorsque l'emplacement est renvoyé et sur
true code> lorsque le bouton est enfoncé.
@Robinzigmond J'ai essayé de faire exactement cela, mais cela ne fonctionnait pas bien. J'ai ajouté plus d'informations à ce sujet dans les détails de la question.
L'astuce consiste à faire
postlocation de retour (POS) code> au lieu de
postlocation (POS) code>. En retournant, vous passez la promesse au prochain
.Chen () code>, sinon le prochain
.Chen () code> résoudre immédiatement parce que vous êtes retourné vide / non défini.