2014-02-06 3 views
0

현재의 7 일 달력을 5 일 달력으로 변경하려고합니다. 7 일은 일요일에서 토요일까지 진행되며 월요일부터 금요일로 변경하려고합니다. 내가 프로그래머 이렇게 두 가지 방법 주운 것과7 일 달력을 5 일 달력으로 변경

: 나는 그것이 어떻게 작동하는지 내 머리 라운드를 얻을 수없는 단지 두 가지를 쳐다 보면서 한

-Hide both Sunday and Saturday columns using css. 
-Rerun script to exclude Sunday and Saturday, calculating the dates again. 

를, 내가 찾고 있어요 도움이 필요해.

createcalendar에() 광고로,이 같은 것을 할 수있는 작품 루프 내부에있는 모든 가정

calendarString = ''; 
calendarString += '<table width="100%" height="425" data-role="table" border="1" bordercolor="#c0c0c0" cellpadding="0" cellspacing="0">'; 
calendarString += '<tr>'; 
calendarString += '<td bgcolor=\"#DDDDDD\" align=\"center\" valign=\"center\" width=\"40\" height=\"22\">Sun<\/td>'; 
calendarString += '<td bgcolor=\"#DDDDDD\" align=\"center\" valign=\"center\" width=\"40\" height=\"22\">Mon<\/td>'; 
calendarString += '<td bgcolor=\"#DDDDDD\" align=\"center\" valign=\"center\" width=\"40\" height=\"22\">Tue<\/td>'; 
calendarString += '<td bgcolor=\"#DDDDDD\" align=\"center\" valign=\"center\" width=\"40\" height=\"22\">Wed<\/td>'; 
calendarString += '<td bgcolor=\"#DDDDDD\" align=\"center\" valign=\"center\" width=\"40\" height=\"22\">Thu<\/td>'; 
calendarString += '<td bgcolor=\"#DDDDDD\" align=\"center\" valign=\"center\" width=\"40\" height=\"22\">Fri<\/td>'; 
calendarString += '<td bgcolor=\"#DDDDDD\" align=\"center\" valign=\"center\" width=\"40\" height=\"22\">Sat<\/td>'; 
calendarString += '<\/tr>'; 
thisDate == 1; 

for (var i = 1; i <= 6; i++) 
{ 
    calendarString += '<tr>'; 
     for (var x = 1; x <= 7; x++) 
      { 
       daycounter = (thisDate - firstDay)+1; 
       thisDate++; 
       if ((daycounter > numbDays) || (daycounter < 1)) 
        { 
         calendarString += '<td align=\"center\" bgcolor=\"#888888\" height=\"30\" width=\"40\">&nbsp;<\/td>'; 
        } 
        else 
         { 
          if (checkevents(daycounter,monthNum,yearNum,i,x) || ((todaysDay == x) && (todaysDate == daycounter) && (todaysMonth == monthNum))) 
           { 
            if ((todaysDay == x) && (todaysDate == daycounter) && (todaysMonth == monthNum)) 
             { 
              tempweek = i; 
              tempdayofweek = x; 
              calendarString += '<td style=\"vertical-align: top;\" bgcolor=\"#AAFFAA\" height=\"30\" width=\"40\" onClick=showevents(' + daycounter + ',' + monthNum + ',' + yearNum + ',' + i + ',' + x + ')>' + daycounter + '<\/td>'; 
             } 
           else  
            { 
            calendarString += '<td style=\"vertical-align: top;\" bgcolor=\"#FFFFC8\" height=\"30\" width=\"40\" onClick=showevents(' + daycounter + ',' + monthNum + ',' + yearNum + ',' + i + ',' + x + ')>' + daycounter + '<div id="amountevent" style="padding-left:5px;max-height:8px; height:8px; width:30px; max-width:30px;white-space: nowrap;">' + displayeventnumber(daycounter, monthNum, yearNum) + '</div><\/td>'; 


            } 
          } 
          else 
           { 
            calendarString += '<td style=\"vertical-align: top;\" bgcolor=\"#f9f9f9\" height=\"30\" width=\"40\">' + daycounter + '<\/td>';   
           } 
         } 
       } 
      calendarString += '<\/tr>'; 
     } 
    calendarString += '<\/table>'; 
    var object=document.getElementById('calendar'); 
    object.innerHTML= calendarString; 
    thisDate = 1; 

답변

1

CSS 솔루션은 더 지저분한 코드와 2 일간의 점프 문제 모두를 해결하지만 JS를 수정하는 것이 좋습니다.

table td:first-child, table td:last-child { 
    display: none; 
} 

문제 : : 마지막으로 아이가 이전 버전의 브라우저 (IE < 9)에 작동하지 않습니다 당신이 이런 식으로 할 수 있도록

그들은, 처음과 마지막 요소입니다. 해결 방법 :

$('table td:first-child, table td:last-child').remove() 

주 : jQuery를 크로스 브라우저를 작동 당신은 당신이 thisDate == 1;을 의미 하시겠습니까? 아니면 하나 =?

+0

나는 비슷한 것을 시도해 보았지만,이 시도를 해보지 만 계획은 5 일과 7 일 일정 사이를 전환 할 수있게하는 것입니다. 이것은 단지 하나의 "="일뿐입니다. – Aero204

1

다음에 thisDate = 1까지 : 또한

for (var i = 1; i <= 6; i++) { 
    thisDate++ //Sunday 
    calendarString += '<tr>' 

    for (var x = 2; x <= 6; x++) { 
     //all of that inner for loop code 
    } 

    calendarString += '</tr>' 
    thisDate++ //Saturday 
} 

: thisDate == 1가되어야한다 맨 처음 for 루프 앞에.

+0

내 친구, 또 다른 작은 버그를 만났습니다, 내 달력은 항상 마지막 날이 28 일이라고 생각합니까 ?? – Aero204

+0

대답 주셔서 감사합니다, 그것은 작동합니다. 하지만 저는 css 메서드를 사용할 것입니다. 쉽게 구현. – Aero204