Méthode de mise en œuvre du compte à rebours JavaScript minutes et secondes_compétences javascript

L'exemple de cet article décrit la méthode d'implémentation du compte à rebours JavaScript. Partagez-le avec tout le monde pour votre référence. L'analyse spécifique est la suivante :

1. Objectifs de base

Concevez un compte à rebours en JavaScript qui rendra le bouton non cliquable une fois le temps écoulé

L'effet spécifique est celui indiqué ci-dessous. Afin d'illustrer le problème, la table est ajustée pour sauter toutes les 50 millisecondes, soit toutes les 0,05

.

Lors de son utilisation réelle, ajustez simplement setInterval("clock.move()",50); dans window.onload=function(){...} de 50 à 1000.

Le bouton peut toujours être cliqué avant la fin du temps imparti.

Une fois le temps écoulé, il est impossible de cliquer sur le bouton.

2. Processus de production

Copier le code Le code est le suivant :

Temps restant : <script> /*Déclare la fonction à utiliser par la fonction principale*/ <br> var horloge=nouvelle horloge(); <br> /*Pointeur vers le minuteur*/ <br> minuterie variable ; <br> window.onload=function(){ <br> /*La fonction principale appelle simplement la méthode move dans la fonction clock toutes les 50 secondes*/ <br> Timer=setInterval("clock.move()",50); <br> }  <br> fonction horloge(){ <br> /*s est une variable dans clock(), pas une variable globale comme var, qui représente les secondes restantes*/ <br> Ceci.s=140; <br> This.move=function(){ <br> ​​​​/*Appelez la fonction d'échange pour convertir les secondes en minutes avant la sortie. Comme l'échange n'est pas utilisé dans la fonction principale window.onload, il n'est pas nécessaire de le déclarer*/ <br>           document.getElementById("timer").innerHTML=exchange(this.s); ​ ​ ​ /*À chaque appel, les secondes restantes seront décrémentées*/  <br> Ceci.s=this.s-1; <br>                                                          /*Si le temps est écoulé, une fenêtre contextuelle apparaîtra, rendant le bouton indisponible, et arrêtera d'appeler move() dans la fonction horloge*/ <br> Si(this.s<0){ <br /> alert("Le temps est écoulé"); <br />                document.getElementById("go").disabled=true <br />                                                                                             ,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,, ,,,,,,,,                                                                                                                                                                                                                                           }  <br /> échange de fonctions (temps) { <br /> /*La division Javascript est une division en virgule flottante, et Math.floor doit être utilisé pour obtenir la partie entière*/ <br /> This.m=Math.floor(time/60); <br />               /*Il y a une opération de reste*/ <br /> This.s=(heure`); <br /> This.text=this.m "minutes" this.s "secondes" <br />;                       /*Ne l'utilisez pas pour le paramètre formel transmis time, et les autres variables utilisées dans cette fonction doivent l'utiliser*/ <br />            renvoyer ce.text;                                     } <br /> </script>


J'espère que cet article sera utile à la conception de la programmation JavaScript de chacun.