js timer implémentation de l'exemple d'analyse de l'effet de compte à rebours-js tutoriel-php.cn

js timer implémentation de l'exemple d'analyse de l'effet de compte à rebours

小云云

Libérer： 2018-01-19 14:20:28

original

1451 Les gens l'ont consulté

Cet article présente principalement l'effet de compte à rebours de js en détail à tout le monde. Il a une certaine valeur de référence. Les amis intéressés peuvent s'y référer.

Fonction Date

Compte à rebours = Utiliser l'heure future - Heure actuelle

Problème : Distance temporelle future 1970 millisecondes - La distance entre aujourd'hui et 1970 est de 1

Utilisez le nombre de millisecondes dans le futur - le nombre de millisecondes maintenant et continuez simplement à convertir

<!DOCTYPE html>
<html>
<head lang="en">
 <meta charset="UTF-8">
 <title></title>
 <style>
  body{
   font-size:30px;
   text-align: center;
   color:red;
  }
 </style>
 <script>
  window.onload = function(){
   var demo = document.getElementById("demo");
   var endTime = new Date("2017/11/12 17:30:00"); // 最终时间
   setInterval(clock,1000); // 开启定时器
   function clock(){
    var nowTime = new Date(); // 一定是要获取最新的时间
    // console.log(nowTime.getTime()); 获得自己的毫秒
    var second = parseInt((endTime.getTime() - nowTime.getTime()) / 1000);
    // 用将来的时间毫秒 - 现在的毫秒 / 1000 得到的 还剩下的秒 可能处不断 取整
    // console.log(second);
     // 一小时 3600 秒
    // second / 3600 一共的小时数 /24 天数
    var d = parseInt(second / 3600 / 24); //天数
    //console.log(d);
    var h = parseInt(second / 3600 % 24) // 小时
    // console.log(h);
    var m = parseInt(second / 60 );
    //console.log(m);
    var s = parseInt(second ); // 当前的秒
    console.log(s);
    /* if(d<10)
    {
     d = "0" + d;
    }*/
    d<10 ? d="0"+d : d;
    h<10 ? h="0"+h : h;
    m<10 ? m="0"+m : m;
    s<10 ? s="0"+s : s;
    demo.innerHTML = "距离抢购时间还剩: "+d+"天 "+h+"小时 "+m+"分钟 "+s+"秒";

   }
  }
 </script>
</head>
<body>
<p id="demo"></p>
</body>
</html>

Copier après la connexion

Plus Pour le contenu, veuillez vous référer à : Résumé de l'implémentation js de la fonction de compte à rebours

Recommandations associées :

Comment implémenter la fonction de barre de progression de la minuterie h5

Javascript implémente un exemple de fonction de barre de progression basé sur la minuterie

Partage de la façon d'utiliser le plug-in de minuterie de secteur jQuery pietimer

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!