The method of implementing the Simple Countdown function of jquery _jquery

The example of this article describes the method of jquery to realize the simple countdown function. Share to everyone for your reference, specific as follows:

1. The effect chart is as follows:

2.html Code:

<div class= "Timefix" >
  <div class= "Daojishi" id= "09/04/2016 00:00:00" > <span class= "Timeh"
    ></span>
    <span class= "Timem" ></span>
    <span class= "Times" ></span>
    <span class= "Timen" ></span>
  </div>
</div>

3.js Code:

SetInterval (lxfendtime,60); Countdown function Lxfendtime () {$ (". Daojishi"). each (function () {//var lxfday=$ (this). attr ("Lxfday");//To determine whether to display the number of days in the variable V  AR endtime = new Date ($ (this). attr ("id")). GetTime ();//Fetch End date (millisecond value) var nowtime = new Date (). GetTime (); Today's date (millisecond value) var youtime = endtime-nowtime;//How much longer (millisecond value) var seconds = youtime/1000;//sec var minutes = Math.floor (SE
   CONDS/60)//cent var hours = Math.floor (MINUTES/60);//hours var days = Math.floor (HOURS/24);/day Var cday=;
   var chour= hours% 24;
   var cminute= minutes% 60;
   var csecond= math.floor (seconds%60);//"%" is the remainder operation, which can be understood as 60 in one after the remainder, then as long as the remainder.
   var c=new Date ();
   var millseconds=c.getmilliseconds ();
   var cmillseconds=math.floor (Millseconds%100);
   if (csecond<10) {//If the number of seconds is singular, the front is 0 csecond= "0" +csecond;
   if (cminute<10) {//If the number of minutes is singular, the front is 0 cminute= "0" +cminute;
   if (chour<10) {//If the number of hours is singular, the front is 0 chour= "0" +chour; } if (cmillseconds<10) {//If the number of milliseconds is singular, the front is 0 cmillseconds= "0" +cmilLseconds; } if (Endtime<=nowtime) {$ (this). HTML ("expired")//The prompt expires if the end date is less than the current date}else{$ (this). HTML ("<span class= H ' > "+chour+" </span><span class= ' Timem ' > "+cminute+" </span><span class= ' times ' > ' +
   csecond+ "</span><span class= ' timen ' >" +cmillseconds+ "</span>");

 }
});

More interested readers of jquery related content can view the site topics: "jquery date and time Operation tips Summary", "JQuery Extended Skills Summary", "jquery common Plug-ins and Usage summary", "jquery drag and drop effects and tips summary", "jquery Table" ( Table) Summary of operational techniques, "Summary of Ajax usage in jquery", "jquery common Classic Effects Summary", "jquery animation and special effects usage Summary" and "jquery Selector usage Summary"

I hope this article will help you with the jquery program design.