js显示一周的时间监听当前的时间，急急急！！！


求大佬写一个案例，在此膜拜了

解决方案 »

  1.   

    <script src="http://cdn.bootcss.com/jquery/1.7.1/jquery.min.js"></script>
    <table border="1" id="tbDate">
        <tr align="center"><td colspan="2">Day<span></span></td><td colspan="2">Month<span></span></td><td colspan="2">Year<span></span></td><td>咨询客服</td></tr>
        <tr align="center"><td>星期一</td><td>星期二</td><td>星期三</td><td>星期四</td><td>星期五</td><td>星期六</td><td>星期日</td></tr>
    </table>
    <style>.focus{background:#333;color:#fff}#tbDate span{display:block}</style>
    <script>
        var d = new Date(), day = d.getDay();
        var tbDate = $('#tbDate'), span = tbDate.find('tr:first span'), tdDays = tbDate.find('tr:eq(1) td');
        span.eq(0).html(d.getDate()); span.eq(1).html(d.getMonth() + 1); span.eq(2).html(d.getFullYear());
        tdDays.click(function () {
            if (this.className == 'focus') return;
            var i=$(this).index(),j=tdDays.filter('.focus').removeClass('focus').index()
            this.className = 'focus';
            d.setDate(d.getDate() + i - j);
            span.eq(0).html(d.getDate()); span.eq(1).html(d.getMonth() + 1); span.eq(2).html(d.getFullYear());
        }).eq(day == 0 ? 6 : day - 1).addClass('focus');
    </script>Web开发学习资料推荐
    配置chrome支持本地（file协议）ajax请求
    jqGrid分页pager配置
      

  2.   

    这是楼上的代码，我稍微改动了一下，你基础太差了需要多练啊
    <!DOCTYPE html>
    <html lang="en"><head>
        <meta charset="UTF-8">
        <title>Snake</title>
    </head><body>
        <script src="http://cdn.bootcss.com/jquery/1.7.1/jquery.min.js"></script>
    <table border="1" id="tbDate">
        <tr align="center"><td colspan="2">Day<span></span></td><td colspan="2">Month<span></span></td><td colspan="2">Year<span></span></td><td>咨询客服</td></tr>
        <tr align="center"><td>星期一</td><td>星期二</td><td>星期三</td><td>星期四</td><td>星期五</td><td>星期六</td><td>星期日</td></tr>
    </table>
    <style>.focus{background:#333;color:#fff}#tbDate span{display:block}.current{background:red;color:#fff}</style>
    <script>
        var d = new Date(), day = d.getDay();
        var tbDate = $('#tbDate'), span = tbDate.find('tr:first span'), tdDays = tbDate.find('tr:eq(1) td');
        span.eq(0).html(d.getDate()); span.eq(1).html(d.getMonth() + 1); span.eq(2).html(d.getFullYear());
        tdDays.click(function () {
            if (this.className == 'focus') return;
            var i=$(this).index(),j=tdDays.filter('.focus').removeClass('focus').index()
            $(this).addClass('focus');
            d.setDate(d.getDate() + i - j);
            span.eq(0).html(d.getDate()); span.eq(1).html(d.getMonth() + 1); span.eq(2).html(d.getFullYear());
        }).eq(day == 0 ? 6 : day - 1).addClass('focus current');
    </script>
    </body></html>
      

  3.   

    给你个我之前写的，你稍微改改就能用http://blog.csdn.net/qq_34117170/article/details/77453984
      

  4.   

    <style type="text/css">
      #week li{
        float: left;
        list-style: none;
        background: #333;
        color: #fff;
        width: 40px;
        height: 40px;
        line-height: 40px;
        text-align: center;
      }
      #week li.currToday{
        color: red;
      }
    </style>
    <ul id="week">
    </ul>
    <input type="text" name="" id='dateInput'>
    <script type="text/javascript">
       var DDay=new Date();
       var tYear=DDay.getFullYear();
       var tMonth=DDay.getMonth()+1;
       var tToday=DDay.getDate();
       var zYear=null,zMonth=null,zToday=null;
       var wWeek=document.getElementById('week');
       var dateInput=document.getElementById('dateInput');
       function load(zYear,zMonth,zToday){
          var Y=zYear||tYear;
          var M=zMonth||tMonth;
          var T=zYear||tToday;
          var week = DDay.getDay() == 0 ? 7: DDay.getDay();
          var all = new Date(Y, M, 0).getDate();
          var prevall = new Date(Y, M-1, 0).getDate();
          console.log(all);
          for(var i=1;i<8;i++){
              nLi=document.createElement('li');
              wWeek.appendChild(nLi);
              li=document.getElementsByTagName('li');
              li[i-1].innerHTML=getWeek(i);
              if(week==i){
                li[i-1].className='currToday'
                var currT=T>all?(T-all):T;
               var currM=T>all?(M+1):M;
                var currY=currM>12?(Y+1):Y;
                 li[i-1].setAttribute('date-init',currY+'-'+currM+'-'+currT);
                dateInput.value= li[i-1].getAttribute('date-init')
              }
              if(i>week){
                var currT=(T+(i-week))>all?(T+(i-week)-all):T+(i-week);
                var currM=(T+(i-week))>all?(M+1):M;
                var currY=currM>12?(Y+1):Y;
                 li[i-1].setAttribute('date-init',currY+'-'+currM+'-'+currT);
              }
              if(i<week){
                var currT=T-(week-i)<=0?(T+prevall-(week-i)):T-(week-i)>all?(T-(week-i)-all):T-(week-i)
                var currM=(T-(week-i))>0?((T-(week-i))>all?(M+1):M):M-1;
                var currY=currM>12?(Y+1):Y;
                 li[i-1].setAttribute('date-init',currY+'-'+currM+'-'+currT);
              }      }
           for(var i=0;i<7;i++){
             li[i].onclick=function(){
                for(var i=0;i<7;i++){
                  li[i].className='';
                }
                dateInput.value= this.getAttribute('date-init')
                this.className='currToday';
             }
          }
       }
       load();
      
       function getWeek(m){
        switch(m){
          case m=1:
          return '周一';
          case m=2:
          return '周二';
          case m=3:
          return '周三';
          case m=4:
          return '周四';
          case m=5:
          return '周五';
          case m=6:
          return '周六';
          case m=7:
          return '周日';    }
       }
       
    </script>