texte du bouton HTML ne changera pas avant boucle infinie

voix
0

Dans le code ci-dessous:

<link href=https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css rel=stylesheet>
<button type=button class=btn btn-danger id=TxChg>Proceed</button>
<script src=https://code.jquery.com/jquery-3.3.1.slim.min.js></script>
<script src=https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js></script>
<script>
  idcate = 0;

  function checkbuff() {
    while ((idcate == 0)) {
      mis = new Date().getSeconds() % 30;
      if (mis == 2) {
        idcate = 1;
      }
    }
  }
  $('#TxChg').click(function() {
    document.getElementById(TxChg).innerHTML = <i class='fa fa-refresh fa-spin'></i>Processing...;
    checkbuff();
  });
</script>

Je veux laisser le bouton « Txchg » changer son texte à « Traitement ... » avant la course de fucntion checkbuff ().

Je ne sais pas pourquoi ce code toujours exécuter la fonction checkbuff () d'abord, puis je verrai le bouton a changé son texte?

Créé 07/11/2018 à 20:17
source utilisateur
Dans d'autres langues...                            


1 réponses

voix
1

Plutôt que le spam en boucle votre système, puisque vous attendez une seconde en particulier de se produire, vous devez effectuer votre boucle logique sur la seconde. Et vous pouvez SetTimeOut votre appel initial et pour donner au navigateur une chance de redessiner.

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet">
<button type="button" class="btn btn-danger" id="TxChg">Proceed</button>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>
<script>
  idcate = 0;

  function checkbuff() {
    if (!idcate) {
      var mis = new Date().getSeconds() % 30;
      
      console.log(mis);
      
      if (mis === 2) {
        idcate = 1;
      } else {
        setTimeout(checkbuff, 1000);
      }
    }
  }
  
  $('#TxChg').click(function() {
    document.getElementById("TxChg").innerHTML = "<i class='fa fa-refresh fa-spin'></i>Processing...";
    setTimeout(checkbuff, 0);
  });
</script>

Créé 07/11/2018 à 20:32
source utilisateur

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more