Maison > interface Web > js tutoriel > le corps du texte

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

WBOY
Libérer: 2016-05-16 16:16:27
original
1154 Les gens l'ont consulté

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
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.
Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!