Css--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
        .sjc
          {
         font-size: 12px; line-height: 20px;
          }
         .s_time
         {
          }
         .end_time
         {
          }
         .endtime_div
         {
          font-size: 12px; line-height: 20px;
         }
         .endtime_div_hide
         {
          font-size: 12px; line-height: 20px; display:none; color:Red;
          }
         .time_d
         {
          }
       .time_h
        {
        }
       .time_m
        {
         }
       .time_s
       {
        }

jQuery---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- $(".sjc").each(function(){

/*获得开始时间*/
           var x= $(this).children(".s_time").html();
             /*获得结束时间*/
           var x2=$(this).children(".end_time").text();
    
               /*************************倒计时*************************/
      
         //判断活动是否已经过期的函数
          function ck_guoqi(jssj)
          {
              var ck=true;
             var dn_0=new Date();//获得当前时间;
              var dtArr2 = jssj.split("-");
              var dt2 = new Date(dtArr2[0]+"/"+dtArr2[1]+"/"+dtArr2[2]);
              if(dn_0>dt2)
              {
              ck=false;
              }
              return ck;
          }
         if(ck_guoqi(x2))
          {
        
         $(this).parent().next().next().children(".endtime_div_hide").hide();
         var myendtime_div=$(this).parent().next().next().children(".endtime_div").show();
        
         alert(myendtime_div.html());
         time_cha();
         function time_cha()
           {
          //********当前时间*********
         var time_start=new Date().getTime();
//  
          //********结束时间*********
//         var etime=$(this).parent().prev().prev().children().find(".end_time").text();
         var dtArr =  x2.split("-");
         var time_end = new Date(dtArr[0]+"/"+dtArr[1]+"/"+dtArr[2]).getTime();
          // 计算时间差
      var time_distance = time_end - time_start;
       // 天
      var int_day = Math.floor(time_distance/86400000)
      time_distance -= int_day * 86400000;
      // 时
      var int_hour = Math.floor(time_distance/3600000)
      time_distance -= int_hour * 3600000;
      // 分
      var int_minute = Math.floor(time_distance/60000)
      time_distance -= int_minute * 60000;
      // 秒
      var int_second = Math.floor(time_distance/1000)
      // 时分秒为单数时、前面加零
     if(int_day < 10){
   int_day = "0" + int_day;
      }
     if(int_hour < 10){
  int_hour = "0" + int_hour;
      }
     if(int_minute < 10){
  int_minute = "0" + int_minute;
      }
     if(int_second < 10){
  int_second = "0" + int_second;
      }
 // 显示时间
 myendtime_div.children(".time_d").text(int_day);
    myendtime_div.children(".time_h").text(int_hour);
    myendtime_div.children(".time_m").text(int_minute);
    myendtime_div.children(".time_s").text(int_second);
 // 设置定时器
          setTimeout(time_cha,1000);
           }
           }else{
          
           $(this).parent().next().next().children(".endtime_div_hide").show();
           $(this).parent().next().next().children(".endtime_div").hide();
          
           }
          
          
          
           });
div-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
 <div style="width: 150px; height: 20px; float: left;">
  <span class="sjc">
  <span class="s_time">2015-11-20</span>
  至<span class="end_time">2015-12-9</span></span>
  </div>
  <div style="width: 40px; height: 20px; float: left; margin-left: 10px;">
    <img src="data:images/lmfwxqy/clock_grey.png" /></div>
  <div style="width: 160px; height: 20px; float: left;">
     <div class="endtime_div">
      <span class="time_d" ></span><span>天</span><span class="time_h"></span><span>时</span><span class="time_m" ></span><span>分</span><span class="time_s" ></span><span>秒</span>
     </div>
     <div class="endtime_div_hide">
      活动已结束!
      </div>
      </div>
-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------作为小白编写的第一个js效果

jQuery倒计时的更多相关文章

  1. 20个非常棒的jQuery倒计时脚本

    使用jQuery倒计时插件可能是最简单最好的方式添加动态和交互式倒数计时器到您的网站上.我相信你已经注意到了,例如倒计时功能运行网站,显示倒计时,直到一个大事件.当网站正在维护,告诉用户什么时候回来, ...

  2. jQuery倒计时插件

    倒计时jQuery插件 引言 最近又换工作了,还不错,我换工作的次数其实有点频繁,2014年7月份毕业,到现在工作已经换了3份了,工资跟刚毕业时候相比也涨了点儿,最近一次换工作我离开了深圳,来到了北京 ...

  3. jquery倒计时(仿团购)转至 http://justcoding.iteye.com/blog/2210962

    倒计时一般是用来表示未来某一时刻距现在时刻还剩多少时间.倒计时在WEB上应用非常广泛,如考试系统倒计时,团购网站中的优惠活动倒计时等等.今天,我们来使用jQuery实现一个简单的倒计时功能.

  4. jquery倒计时按钮常用于验证码倒计时

    <!doctype html><html><head> <meta charset="utf-8"> <title>jq ...

  5. jquery 倒计时

    今天让我公司前端大神,李杨哥,给做了一个jquery倒计时功能  很牛逼 看下面的效果图 这个倒计时是需要传值的,看效果代码讲解  百度云盘 ,压缩包永久有效  链接: https://pan.bai ...

  6. jquery倒计时代码

    jquery倒计时代码<pre> <span id="day_show">0天</span> <strong id="hour_ ...

  7. jQuery倒计时组件(jquery.downCount.js)

    //html <span class="days">00</span> <span class="hours">00< ...

  8. Jquery倒计时源码分享

    在静态页添加显示倒计时的容器,并引用下面脚本,代入时间参数即可使用. timeoutDate——到期时间,时间格式为2014/01/01或2014/1/1 D——天 H——小时 M——分钟 S——秒 ...

  9. jQuery倒计时实例

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. fastcgi配置

    fastcgi配置 我们这里说的fastcgi配置专指nginx对fastcgi的配置,fastcgi本身的配置介绍在fastcgi 安装文中有说明. nginx的fastcgi模块提供的命令 fas ...

  2. Windows Phone中扩展WebBrowser使其支持绑定html内容

    在WP开发中,有时候会用到WebBrowser控件来展示一些html内容,这个控件有很多局限性,比如不支持绑定内容,这样的MVVM模式中就无法进行内容的绑定.为了实现这个目的,需要扩展一下,具体代码如 ...

  3. Winform图片拖拽与缩放

    最近做项目的时候遇到上传施工平面布置图,查看,因为图片比较大,一般的显示器分辨率无法显示全,然后还需要放大看清楚图片里面的文字内容,所以需要用到图片的拖拽与缩放功能.这里整理下具体操作. 首先新建一个 ...

  4. WinForm 简单蒙版实现控件遮盖

    在Web上面要实现一个遮罩层或者说是蒙版吧,有了DIV那不算什么难事,只要给div定好位置和大小,把颜色的Alpha值设一下就有透明的效果.不过在Winform中实现起来就没那么简单了事.尝试过用一个 ...

  5. shell的比较运算符

    运算符 描述 示例 文件比较运算符 -e filename 如果 filename 存在,则为真 [ -e /var/log/syslog ] -d filename 如果 filename 为目录, ...

  6. 分析.Net里线程同步机制

    我 们知道并行编程模型两种:一种是基于消息式的,第二种是基于共享内存式的. 前段时间项目中遇到了第二种 使用多线程开发并行程序共享资源的问题 ,今天以实际案例出发对.net里的共享内存式的线程同步机制 ...

  7. 使用MiniProfiler跟踪MVC + EF + Bootstrap 2 权限管理系统的性能消耗

    安装MiniProfiler 在MVC + EF + Bootstrap 2 权限管理系统入门级(附源码)文章中下载了它的源码,调试模式下打开一个页面都要再2.5秒以上,所以使用MiniProfile ...

  8. 【C#】第3章补充(二)如何将图形作为对象

    分类:C#.VS2015 创建日期:2016-06-23 使用教材:(十二五国家级规划教材)<C#程序设计及应用教程>(第3版) 一.要点 该例子属于高级技术中的基本用法.对于初学者来说这 ...

  9. C#中在AxWebBrowser控件注入JS脚本的方法

    /// <summary> /// 窗体加载 /// </summary> private void JS_Load(object sender, EventArgs e) { ...

  10. jquery简单原则器(匹配第一个元素)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...