Maison >interface Web >js tutoriel >Javascript implémente les compétences page_javascript du saut du compte à rebours

Javascript implémente les compétences page_javascript du saut du compte à rebours

WBOY
WBOYoriginal
2016-05-16 15:19:381122parcourir
De nombreuses pages Web ont des effets similaires, c'est-à-dire qu'elles peuvent accéder à d'autres pages après un délai spécifié. Si cela est plus humain, cela aura un effet de compte à rebours. Ce chapitre expliquera comment obtenir cet effet. est le suivant :

<script type="text/javascript"> 
var t=10;
setInterval("refer()",1000); 
function refer(){ 
 if(t==0){ 
 location.href="http://www.jb51.net";
 } 
 document.getElementById('show').innerHTML=""+t+"秒后跳转到脚本之家";
 t--;
} 
</script> 
<span id="show"></span> 
Le code ci-dessus obtient l'effet souhaité et peut accéder à la page spécifiée après 10 secondes. Le processus de mise en œuvre est présenté ci-dessous.
1.Principe de mise en œuvre :
Le principe est très simple, c'est-à-dire utiliser la fonction timer setInterval() pour exécuter la fonction refer() une fois par seconde. Cette fonction peut décrémenter t de 1 sans l'exécuter une seule fois, et en même temps écrire le courant. t dans le div. Si lorsque t diminue à 0, c'est-à-dire que le compte à rebours est terminé, il passera à la page spécifiée. Le principe est à peu près le même.
2. Lecture connexe :
1. Pour la fonction setInterval(), veuillez vous référer au chapitre setInterval() Explication détaillée de l'utilisation de la fonction.
2.location.href se trouve dans l'attribut href du chapitre Objet Location .
3. Pour l'attribut innerHTML, veuillez vous référer au chapitre d'utilisation de l'attribut innerHTML de js.

Permettez-moi de partager avec vous deux codes de saut simples et de les résumer. Différents codes de saut chronométrés sont enregistrés comme suit :

(1) Utilisez la fonction setTimeout pour implémenter des sauts de timing (le code suivant doit être écrit dans la zone du corps)

<script type="text/javascript"> 
//3秒钟之后跳转到指定的页面 
setTimeout(window.location.href='http://www.jb51.net',3); 
</script> 

(2) Implémentation du code HTML, ajoutez le code suivant dans le bloc de zone d'en-tête de la page

<!--5秒钟后跳转到指定的页面--> 
<meta http-equiv="refresh" content="5;url=http://www.jb51.net" /> 

Déclaration:
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