Définition et utilisation méthode setTimeout()
JavaScript cours tutorialLa méthode setTimeout() appelle une fonction ou évalue une expression après un nombre spécifié de millisecondes (1 seconde = 1000 ms).
Astuce : La fonction s'exécute uniquement une fois. Si vous avez besoin de répéter l'exécution, utilisez la méthode setInterval() .
Astuce : Utilisez la méthode clearTimeout() pour empêcher l’exécution de la fonction.
Exemple Afficher un message d'alerte après 3 secondes :
Sélectionner le code
<!doctype html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>Exemple méthode setTimeout()</title>
</head>
<p>Cliquer le bouton pour voir le résultat</p>
<button onclick="maFonction()"> ENVOYER </button>
<script>
function maFonction()
{
setTimeout(function(){alert("Hello")},3000);
}
</script>
</body>
</html>
Appui de navigateur
La méthode setTimeout() est prise en charge dans tous les principaux navigateurs.
Syntaxe
setTimeout(fonction,millisecondes,langage)
Valeurs de paramètre
| Paramètre | Description |
|---|---|
| fonction | Obligatoire. La fonction qui sera exécutée |
| millisecondes | Obligatoire. Le délais en millisecondes avant l’exécution de la fonction |
| langage | Optionel. le langage du script : JavaScript | VBScript |
Valeur de retour
| Un entier avec la valeur de l'ID de l'horloge qui est définie. Utilisez cette valeur avec la méthode clearTimeout() pour annuler la minuterie. |
Définition et utilisation la méthode clearTimeout()
La méthode clearTimeout() arrête une minuterie défini avec la méthode setTimeout() .
La valeur de l'ID retournée par setTimeout() est utilisée comme paramètre pour la méthode de clearTimeout().
Remarque : Pour être en mesure d'utiliser la méthode clearTimeout(), vous devez utiliser une variable globale lors de la création de la méthode de délai d'attente :
myVar = setTimeout("javascript function",milliseconds);
Ensuite, si la fonction n'a pas déjà été exécutée, vous serez en mesure d'arrêter l'exécution en appelant la méthode clearTimeout().
Exemple Utiliser clearTimeout pour empêcher la fonction de s’exécuter :
Sélectionner le code
<!doctype html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>Exemple méthode setTimeout() Utiliser
clearTimeout pour empêcher l’exécution de la fonction
</title>
</head>
<p>En cliquant sur le bouton "marche" une boite d'alerte
est affichée après une attente de 3 secondes.</p>
<p>Mais si vous Cliquez sur le bouton "stop" avant que les
3 secondes ne soit écoulées vous aller empêcher l'exécution de la
première fonction.</p>
<button onclick="maFonction()">Marche</button>
<button onclick="maStopFonction()">Stop</button>
<script>
var myVar;
function maFonction()
{
myVar = setTimeout(function(){alert("Bonjour")},3000);
}
function maStopFonction()
{
clearTimeout(myVar);
}
</script>
</body>
Appui de navigateur
La méthode clearTimeout() est prise en charge dans tous les principaux navigateurs.
Syntaxe
clearTimeout(id_de_setTimeout)
Valeurs de paramètre
| Paramètre | Description |
|---|---|
| id_de_setTimeout | Obligatoire. La valeur de l'ID du timer retourné par la méthode setTimeout() |
Autres exemples
Exemple Afficher un texte synchronisé :
Sélectionner le code
<!doctype html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>Exemple méthode setTimeout()</title>
</head>
<p>Cliquez sur le bouton ci-dessous. Le champ de saisie
affichera le temps quand deux, quatre et six secondes serons
écoulés</p>
<button onclick="afficheTexte()">Voir</button>
<input type="text" id="texte">
<script>
function afficheTexte()
{
var x = document.getElementById("texte");
setTimeout(function(){x.value="2 seconds"},2000);
setTimeout(function(){x.value="4 seconds"},4000);
setTimeout(function(){x.value="6 seconds"},6000);
}
</script>
</body>
</html>
Exemple Ouvrir une nouvelle fenêtre et la fermer au bout de trois secondes (3 000 millisecondes) :
Ouvre automatiquement une petite fenêtre et le ferme après un certain temps. Idéal pour l'affichage des messages importants sans forcer les utilisateurs à fermer plusieurs fenêtres!
Sélectionner le code
<!doctype html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>Exemple méthode setTimeout()</title>
</head>
<p>Cliquez sur le bouton pour ouvrir une nouvelle fenêtre
et la fermer après quatre secondes (4 000
millisecondes)</p>
<button onclick="ouvreFenetre()">Ovrir</button>
<script>
function ouvreFenetre()
{
var myWindow = window.open("","myWindow","width=400,height=150");
myWindow.document.write("<p><b>cette fenêtre sera
fermée dans 4 secondes soit
4000millisecondes.</b></p>");
setTimeout(function(){myWindow.close()},3000);
}
</script>
</body>
</html>
Exemple Comment créer un comptour avec un bouton d'arrêt :
Sélectionner le code
<!doctype html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>Exemple méthode setTimeout() comment créer
un compteur </title>
</head>
<button onclick="startCount()">commencer le
compte!</button>
<input type="text" id="txt">
<button onclick="stopCount()">Stop compte!</button>
<p>
Cliquez sur le bouton « commencer le compte! » ci-dessus pour
démarrer la compteur. Le champ de saisie va afficher le compte
en commençant à 0. Cliquez sur le bouton "Stop compte!" pour
arrêter le décompte. Cliquez sur le bouton « commencer le compte!
» pour reprendre le compte.
</p>
<script>
var compte = 0;
var param;
var timer_compte = 0;
function compteur()
{
document.getElementById("txt").value=compte;
compte = compte+1;
param = setTimeout(function(){compteur()},1000);
}
function startCount()
{
if (!timer_compte)
{
timer_compte=1;
compteur();
}
}
function stopCount()
{
clearTimeout(param);
timer_compte=0;
}
</script>
</body>
</html>
Exemple redirection avec compte à rebours
Sélectionner le code
<!doctype html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>Exemple méthode setTimeout()</title>
<script>
var debut=new Date();
debut=Date.parse(debut)/1000;
var count=20;
function CountDown(){
var temps=new Date();
temps=Date.parse(temps)/1000;
var x=parseInt(count-(temps-debut),10);
if(document.form){document.form.compte.value =
x;}
if(x>0){
timerID=setTimeout("CountDown()",
100)
}else{
location.href="https://www.oujood.com/js/"
}
}
window.setTimeout('CountDown()',100);
</script>
</head>
<body>
<form name="form">
Vous serez rederiger dans
<input type="text" name="compte" size="2" value="20">
secondes.
</form>
</body>
</html>
La méthode secrète likes sans fin sur Facebook
Livre numérique court pour comprendre la méthode secrète permettant d'obtenir des likes sans fin sur Facebook.
GAGNER DE L'ARGENTGRÂCE À FACEBOOK
N'A JAMAIS ÉTÉ SI FACILE
Consulter
