J'essaie de rafraîchir un div auprès de JavaScript à chaque boucle et de voir 1, 2, 3, .... Le code suivant fonctionne, mais affiche uniquement le résultat final (9998). Comment est-il possible d'afficher toutes les étapes? Merci d'avance.
<html>
<head>
</head>
<body>
<div id="cadre" style="width=100%;height=100%;">
<input type="button" value="Executer" onclick="launch();"/>
<div id="result" ></div>
</div>
<script type="text/javascript">
function launch(){
for (inc=0;inc<9999;inc++){
document.getElementById('result').innerHTML = inc;
}
}
</script>
</body>
</html>
3 Réponses :
var i = 0;
function launch(){
var timer = window.setInterval(function(){
if( i == 9999 ){
window.clearInterval( timer );
}
document.getElementById('result').innerHTML = i++;
}, 100);
}
launch();
Cela va essayer de définir document.getelementByID ("résultat"). Innerhtml à 9999 10 000 fois par seconde.
Merci Odhandan, mais j'essaie déjà cette solution et il ne fait qu'un seul résultat final avec ... un retard.
La version éditée est meilleure, mais cela ne va pas s'arrêter à 9 999, ça va continuer à aller pour toujours.
Oui, ça marche! Merci Banderrant. Maintenant, je dois comprendre la différence avec la première version que vous avez donnée.
C'était volontairement, pour vous conduire à des erreurs de ne pas vous engager ... Je plaisante .. C'est ce qui se passe lorsque vous codez Snatch. La première version était transparente, aucune condition pour arrêter l'intervalle ... Ne voyez-vous pas la différence? vraiment ?
Je vois bien la différence. Merci encore
L'exécution JavaScript et le rendu de la page sont effectués dans le même thread d'exécution, ce qui signifie que lorsque votre code est exécuté, le navigateur ne rétablira pas la page. (Bien que même si cela redécartait la page avec chaque itération de la boucle pour la boucle, il serait si rapide que vous n'auriez pas vraiment le temps de voir les chiffres individuels.)
Ce que vous voulez faire à la place, utilisez plutôt le Settimeout () Code> ou Alors, essayez ceci: p> seinterval () Code> Fonctions (les deux méthodes de la fenêtre Window code> objet). Le premier vous permet de spécifier une fonction qui sera exécutée une fois après un nombre défini de millisecondes; La seconde vous permet de spécifier une fonction qui sera exécutée à plusieurs reprises à l'intervalle spécifié. En utilisant ceux-ci, il y aura des "espaces" entre votre exécution de code dans laquelle le navigateur aura une chance de redessiner la page. P> function launch() {
var inc = 0,
max = 9999;
delay = 100; // 100 milliseconds
var iID = setInterval(function() {
document.getElementById('result').innerHTML = inc;
if (++inc >= max)
clearInterval(iID);
},
delay);
}
Comme je l'ai compris, le truc du premier exemple est dans la pile d'appels.
Essayez
document.getElementById('result').innerHTML += inc;
C'est juste faux. La séquence serait 0, 1, 3, 7 ou pire: concatez les chiffres.
innerhtml est le diable, arrêtez de l'utiliser.
@Raynos existe-t-il un remplacement explicite?