0
votes

Cibler l'élément DOM avec jQuery ne fonctionne pas

J'utilise un JS prometteur pour obtenir de manière asynchrone Obtenir l'emplacement de l'utilisateur à l'intérieur GetLocation () Code>. Et puis je fais une demande Ajax au serveur à l'intérieur de postlocation () code>. xxx pré>

Cependant, modification finalement 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>

EDIT P>

Il convient de noter que je veux noter que je veux masque le signe de chargement après postlocation () code> est exécuté. p>

J'ai essayé de définir "caché" sur true dans un troisième () 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
});


4 commentaires

Si la ligne finale ne devrait-elle pas être dans un autre .Chen () enchaînant le postlocation promesse? Comme c'est le cas, cela se produit synchrone dès que le bouton clique sur le bouton, il est donc premier se cacher, puis montré une fois getLocation 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é à false lorsque l'emplacement est renvoyé et sur true 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) au lieu de postlocation (POS) . En retournant, vous passez la promesse au prochain .Chen () , sinon le prochain .Chen () résoudre immédiatement parce que vous êtes retourné vide / non défini.


3 Réponses :


0
votes

Si vous souhaitez masquer le chargeur, vous devez le faire dans le .Chen () rappel, car c'est à ce moment-là que la promesse a été résolue. Donc, ce que vous voulez faire est de:

  1. Afficher le chargeur avant d'exécuter PostLocation ()
  2. N'oubliez pas de renvoyer la promesse de postlocation () (que vous n'avez pas fait dans le code)
  3. masque le chargeur lorsque la promesse est résolue (après avoir posté la position a réussi)

    Voici votre code fixe: xxx


8 commentaires

Vous voulez dire prop et pas attr


@ 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 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 donc je suppose que hes essaye de cacher le chargeur. Pourrait également utiliser masquer et Afficher . 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 () est exécuté et la masquant après postlocation () finitions, j'ai ajouté plus d'informations à ce sujet dans la question des détails.


@Ahmad getLocation () est exécuté immédiatement, afin que vous puissiez simplement montrer le chargeur juste avant cela. Lorsque getLocation () S Promise est résolu, vous appelez ensuite postlocation () . 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 postlocation de retour (POS) . Cela signifie que le prochain .Chen () est immédiatement résolu;) Voir ma réponse mise à jour.


@Terry La chose est, getLocation () attend la saisie de l'utilisateur, donc je veux seulement montrer le signe de chargement après getLocation () est exécuté.


@Ahmad bien. Si tel est le cas, utilisez l'attribut caché dans le premier .Chen () . Il éteint le seul problème pourquoi votre code d'origine ne fonctionne pas, car vous n'avez pas revenu postlocation () . 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 () finitions, ce qui est encore plus déroutant.



0
votes

Vous utilisez une fonction asynchrone à l'attribut à FALSE. Cela signifie que probablement xxx

est exécuté avant xxx


0 commentaires

0
votes

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);
      });
  }
});


1 commentaires

Cela a du sens, mais je veux réellement montrer le signe après avoir obtenu l'emplacement et le cacher après postlocation () terminé l'exécution.