怎么在页面中计算多个时间差

基本算法d = new Date('2014-06-20'.replace(/-/, '/'));
document.write(Math.ceil((d - new Date())/86400000));
套套就是了

解决方案 »

  1.   

    你是在网页加载完成了之后调用document.write(Math.ceil((d - new Date())/86400000));的吗？
      

  2.   


    我是刚学网页设计。目前刚会静态页面制作。对js还不是很了解。不怎么会用，能帮下写具体点吗直接運行看看。<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
     <head>
      <meta http-equiv="content-type" content="text/html;charset=utf-8">
      <title> New Document </title>
     </head> <body>
    <script type="text/javascript">
    var enddate = ['2014-06-20','2014-06-21','2014-06-22','2014-06-23','2014-06-24'];
    for(var i=0,len=enddate.length; i<len; i++){
    d = new Date(enddate[i].replace(/-/, '/'));
    document.write('结束日期:' + enddate[i] + ' 剩余' + Math.ceil((d - new Date())/86400000) + '天<br>');
    }
    </script> </body>
    </html>
    结束日期:2014-06-20 剩余3天
    结束日期:2014-06-21 剩余4天
    结束日期:2014-06-22 剩余5天
    结束日期:2014-06-23 剩余6天
    结束日期:2014-06-24 剩余7天
      

  3.   


    <html>
    <head>
    <title>Deadline</title>
    </head>
    <script>
      function Endate() {
        var end_date=new Array()
        end_date[0]="2014/06/20";
        end_date[1]="2014/06/21";
        end_date[2]="2014/06/22";
        end_date[3]="2014/06/23";
        for(var i=0,len=end_date.length;i<len;i++){
          ndate = new Date();
          tdate = new Date(end_date[i]);
          dtime = tdate.getTime()-ndate.getTime();
          document.getElementById(i).innerHTML=Math.floor(dtime/86400000)+"<br/>"
        }
      }
    </script>
    <body>
    <input type="button" onclick="Endate()" value="Go!"/>
    <p id="0"></p>
    <p id="1"></p>
    <p id="2"></p>
    <p id="3"></p>
    </body>
    </html>
      

  4.   


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
     <head>
      <meta http-equiv="content-type" content="text/html;charset=utf-8">
      <title> New Document </title>
     </head> <body>
    <ul>
    <li><h2>标题1</h2>结束日期：2014-06-18　　xx此处为判断时间差，小于0输出已结束</li>
    <li><h2>标题2</h2>结束日期：2014-06-19　　xx</li>
    <li><h2>标题3</h2>结束日期：2014-06-20　　xx</li>
    <li><h2>标题4</h2>结束日期：2014-06-21　　xx</li>
    <li><h2>标题5</h2>结束日期：2014-06-22　　xx</li>
    <li><h2>标题6</h2>结束日期：2014-06-23　　xx</li>
    </ul> </body>
    </html>
      

  5.   


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
     <head>
      <meta http-equiv="content-type" content="text/html;charset=utf-8">
      <title> New Document </title>
     </head>
     
     <body><script type="text/javascript">
    function check(dt){
      var d = new Date(dt.replace(/-/, '/'));
      var c = Math.ceil((d - new Date())/86400000)
      if(c<0){
    document.write('已结束');
      }else{
    document.write('剩余' + c + '天');
      }
    }
    </script><ul>
    <li><h2>标题1</h2>结束日期：2014-06-18　<script type="text/javascript">check('2014-06-18');</script></li>
    <li><h2>标题2</h2>结束日期：2014-06-19　<script type="text/javascript">check('2014-06-19');</script></li>
    <li><h2>标题3</h2>结束日期：2014-06-20　<script type="text/javascript">check('2014-06-20');</script></li>
    <li><h2>标题4</h2>结束日期：2014-06-21　<script type="text/javascript">check('2014-06-21');</script></li>
    <li><h2>标题5</h2>结束日期：2014-06-22　<script type="text/javascript">check('2014-06-22');</script></li>
    <li><h2>标题6</h2>结束日期：2014-06-23　<script type="text/javascript">check('2014-06-23');</script></li>
    </ul>
     
     </body>
    </html>
      

  6.   

    <ul>
    <li><h2>标题1</h2>结束日期：2014-06-17</li>
    <li><h2>标题2</h2>结束日期：2014-06-19</li>
    <li><h2>标题3</h2>结束日期：2014-06-20</li>
    <li><h2>标题4</h2>结束日期：2014-06-21</li>
    <li><h2>标题5</h2>结束日期：2014-06-22</li>
    <li><h2>标题6</h2>结束日期：2014-06-23</li>
    </ul>
    <script>
    el = document.getElementsByTagName('li');
    for(i=0; i<el.length; i++) {
      el[i].innerHTML = el[i].innerHTML.replace(/(.+)([\d-]{10})/, function(a,b,c) {
        var d = Math.ceil((new Date(c.replace(/-/, '/')) - new Date())/86400000);
        return b + c + '　　' + (d <= 0 ? '已结束' : d+'天');
      });
    }
    </script>