Codage JavaScript pour un compte à rebours de 10 à 0
JavaScript est un langage de script bien connu et largement utilisé, utilisé principalement pour écrire des applications pour des pages Web. Vous pouvez créer des centaines d'applications utiles à l'aide de JavaScript, y compris un compte à rebours. Vous pouvez coder un script JavaScript pour afficher un compte à rebours de 10 à zéro sur votre page Web et afficher un message lorsqu'il atteint zéro. Les scripts JavaScript peuvent être créés dans n'importe quel éditeur de texte, comme le Bloc-notes et WordPad, mais doivent être enregistrés avec une extension ".js" pour être fonctionnels.
1
Créez un nouveau fichier texte et nommez-le "timer.js". L'extension ".js" indique qu'il s'agit d'un fichier JavaScript. Ouvrez le fichier dans un éditeur de texte, tel que le Bloc-notes ou WordPad.
2
Définissez deux variables (Timer et TotalSeconds) en insérant ces deux lignes:
var Minuterie; var TotalSeconds;
3
Créez une nouvelle fonction (CreateTimer) qui affiche le minuteur sur votre page Web en insérant ce code:
function CreateTimer (TimerID, Time) {Timer = document.getElementById (TimerID); TotalSecondes = Temps ; UpdateTimer () window.setTimeout ("Tick ()", 1000); }
Le "window.setTimeout("Tick()", 1000);" La fonction fait tourner la minuterie toutes les secondes. Votre script ressemble maintenant à ceci :
var Timer; var TotalSeconds;
function CreateTimer (TimerID, Time) {Timer = document.getElementById (TimerID); TotalSeconds = Temps; UpdateTimer () window.setTimeout ("Tick ()", 1000); }
4
Ajoutez une fonction qui oblige la minuterie à diminuer d'une seconde à chaque tick:
function Tick() { if (TotalSeconds <= 0) { alert("Le temps est écoulé !") return ; } TotalSecondes -= 1; UpdateTimer () window.setTimeout ("Tick ()", 1000); }
L'argument "if (TotalSeconds <= 0)" garantit que le compte à rebours s'arrête à zéro et affiche le "Time's up!" un message. Le "window.setTimeout("Tick()", 1000);" La fonction garantit que le compte à rebours continue jusqu'à ce qu'il atteigne zéro.
5
Insérez une fonction pour mettre à jour le minuteur à chaque tick afin que vous puissiez voir le compte à rebours:
function UpdateTimer () {Timer.innerHTML = TotalSeconds; }
6
Votre script ressemble maintenant à ceci:
var Timer; var TotalSeconds;
function CreateTimer(TimerID) { Timer = document.getElementById(TimerID); TotalSeconds = 10; UpdateTimer () window.setTimeout ("Tick ()", 1000); }
function Tick() { if (TotalSeconds <= 0) { alert("Le temps est écoulé !") return ; } TotalSecondes -= 1; UpdateTimer () window.setTimeout ("Tick ()", 1000); }
function UpdateTimer () {Timer.innerHTML = TotalSeconds; }
7
Enregistrez le fichier. Pour utiliser le script sur une page Web, utilisez ce code HTML: