js日历算法

页面  
<div class="un1">
                                <h2>服务档期</h2>
                                <div class="date-panel" style="height: 525px;">
                                    <div class="bars">
                                        <a href="javascript:void (0);" id="monthStart" class="b-l"></a>
                                        <span class="b-c" id="monthInfo"></span>
                                        <a href="javascript:void (0);" id="monthNext" class="b-r"></a>
                                    </div>
                                    <input type="hidden" id="shopId" value="34782e16-53d1-4c1c-b573-e82b0eae5d87" />
                                    <input type="hidden" id="base" value="http://sc.izhaowo.com" />
                                    <input type="hidden" id="schTname" value="ZHUCHIREN001" />
                                    <table id="dateTable" class="picTable">
                                        <tbody>
                                            <tr>
                                                <th>日</th>
                                                <th>一</th>
                                                <th>二</th>
                                                <th>三</th>
                                                <th>四</th>
                                                <th>五</th>
                                                <th>六</th>
                                            </tr>
                                            <tr>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                            </tr>
                                            <tr>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                            </tr>
                                            <tr>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                            </tr>
                                            <tr>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                            </tr>
                                            <tr>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                            </tr>
                                            <tr>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                                <td id="home" valign="top"><span></span></td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>


js代码：
/**
 * Created by dengxu on 14-6-6.
 */
var today = new Date();
var  thisMonth = today.getMonth()+1;
var  thisYear= today.getFullYear();

//日历
window.onload = function(){
    viewSchedule();
}

function viewSchedule (){
    var table = document.getElementById("dateTable");
    var yearS = document.getElementById("monthInfo");
    var dayNum = 0;
    var fullMonth = thisMonth;
    if(fullMonth<10){
        fullMonth = "0"+(fullMonth);
    }
    yearS.innerHTML = thisYear+'年'+(fullMonth)+'月';


    //初始化日期
    var aTD = table.getElementsByTagName("TD");
    //获取本月一号
    today.setFullYear(thisYear);
    today.setMonth(thisMonth-1);
    today.setDate(1);
    //日期
    dayNum = monthDay(thisYear,thisMonth);
    //获取上一个月有多少天
    var exDayNum = monthDay(thisYear,thisMonth-1);
    if(today.getDay()==0) {
        var i = 0;
        for (i; i < dayNum; i++) {
            aTD[i].innerHTML = '<span id="'+thisMonth+'">'+(i + 1)+'</span>';
        }
        var k = 1;
        for (i; i < 42; i++) {
            aTD[i].innerHTML = '<span id="'+(thisMonth+1)+'">'+(k)+'</span>';
            k++;
        }
    }else if(today.getDay()==1) {
        var n = exDayNum - 0;
        var i = 0;
        for (n; n <= exDayNum; n++) {
            aTD[i].innerHTML = '<span id="'+(thisMonth-1)+'">'+(n)+'</span>';
            i++;
        }
        var j = 0;
        for (j; j < dayNum; j++) {
            aTD[i].innerHTML = '<span id="'+thisMonth+'">'+(j + 1)+'</span>';
            i++;
        }
        var k = 1;
        for(i;i<42;i++){
            aTD[i].innerHTML = '<span id="'+(thisMonth+1)+'">'+(k)+'</span>';
            k++;
        }
    }else if(today.getDay()==2) {
        var n = exDayNum - 1;
        var i = 0;
        for (n; n <= exDayNum; n++) {
            aTD[i].innerHTML = '<span id="'+(thisMonth-1)+'">'+(n)+'</span>';
            i++;
        }
        var j = 0;
        for (j; j < dayNum; j++) {
            aTD[i].innerHTML = '<span id="'+thisMonth+'">'+(j + 1)+'</span>';
            i++;
        }
        var k = 1;
        for(i;i<42;i++){
            aTD[i].innerHTML = '<span id="'+(thisMonth+1)+'">'+(k)+'</span>';
            k++;
        }
    }else if(today.getDay()==3) {
        var n = exDayNum - 2;
        var i = 0;
        for (n; n <= exDayNum; n++) {
            aTD[i].innerHTML = '<span id="'+(thisMonth-1)+'">'+(n)+'</span>';
            i++;
        }
        var j = 0;
        for (j; j < dayNum; j++) {
            aTD[i].innerHTML = '<span id="'+thisMonth+'">'+(j + 1)+'</span>';
            i++;
        }
        var k = 1;
        for(i;i<42;i++){
            aTD[i].innerHTML = '<span id="'+(thisMonth+1)+'">'+(k)+'</span>';
            k++;
        }
    }else if(today.getDay()==4) {
        var n = exDayNum - 3;
        var i = 0;
        for (n; n <= exDayNum; n++) {
            aTD[i].innerHTML = '<span id="'+(thisMonth-1)+'">'+(n)+'</span>';
            i++;
        }
        var j = 0;
        for (j; j < dayNum; j++) {
            aTD[i].innerHTML = '<span id="'+thisMonth+'">'+(j + 1)+'</span>';
            i++;
        }
        var k = 1;
        for(i;i<42;i++){
            aTD[i].innerHTML = '<span id="'+(thisMonth+1)+'">'+(k)+'</span>';
            k++;
        }
    }else if(today.getDay()==5) {
        var n = exDayNum - 4;
        var i = 0;
        for (n; n <= exDayNum; n++) {
            aTD[i].innerHTML = '<span id="'+(thisMonth-1)+'">'+(n)+'</span>';
            i++;
        }
        var j = 0;
        for (j; j < dayNum; j++) {
            aTD[i].innerHTML = '<span id="'+thisMonth+'">'+(j + 1)+'</span>';
            i++;
        }
        var k = 1;
        for(i;i<42;i++){
            aTD[i].innerHTML = '<span id="'+(thisMonth+1)+'">'+(k)+'</span>';
            k++;
        }
    }else if(today.getDay()==6) {
        var n = exDayNum-5;
        var i = 0;
        for(n;n<=exDayNum;n++){
            aTD[i].innerHTML = '<span id="'+(thisMonth-1)+'">'+(n)+'</span>';
            i++;
        }
        var j = 0;
        for(j;j<dayNum;j++){
            aTD[i].innerHTML = '<span id="'+thisMonth+'">'+(j + 1)+'</span>';
            i++;
        }
        var k =  1;
        for(i;i<42;i++){
            aTD[i].innerHTML = '<span id="'+(thisMonth+1)+'">'+(k)+'</span>';
            k++;
        }
    }
    //上一个月
    function previous (){
        var  thisM = thisMonth;
        var  thisY= thisYear;
        if(thisM==1){
            thisM = 12;
            thisY = thisY-1;
        }else{
            thisM = thisM-1;
        }
        thisYear = thisY;
        thisMonth = thisM;
        viewSchedule();

    }

    //下一个月
    function next (){
        var  thisM = thisMonth;
        var  thisY= thisYear;
        if(thisM==12){
            thisM = 1;
            thisY = thisY+1;
        }else{
            thisM = thisM+1;
        }
        thisYear = thisY;
        thisMonth = thisM;
        viewSchedule();

    }

    //是否为闰年
    function isLeapYear(year){
        if(year%4==0 && year%100!=0){
            return true;
        }
        else{
            if(year%400==0){
                return true;
            }
            else{
                return false;
            }
        }
    }

    //判断每月有几天
    function monthDay(year,month){
        if(month==1 || month==3 || month==5 || month==7 || month==8 || month==10 || month==12 || month==0){
            return 31;
        }else if(month==4 || month==6 || month==9 || month==11){
            return  30;
        }else if(month==2 && isLeapYear(year)){
            return  29;
        }else{
            return 28;
        }
    }


    function nowDay(){
        var monthStart = document.getElementById("monthStart");
        var monthNext = document.getElementById("monthNext");

        monthStart.onclick = function(){
            previous();
        }
        monthNext.onclick = function(){
            next();
        }
    }
    nowDay();
    setSchedule(table);
}


//格式化日期,
function formatDate(date,format){
    var paddNum = function(num){
        num += "";
        return num.replace(/^(\d)$/,"0$1");
    }
    //指定格式字符
    var cfg = {
        yyyy : date.getFullYear() //年 : 4位
        ,yy : date.getFullYear().toString().substring(2)//年 : 2位
        ,M  : date.getMonth() + 1  //月 : 如果1位的时候不补0
        ,MM : paddNum(date.getMonth() + 1) //月 : 如果1位的时候补0
        ,d  : date.getDate()   //日 : 如果1位的时候不补0
        ,dd : paddNum(date.getDate())//日 : 如果1位的时候补0
        ,hh : date.getHours()  //时
        ,HH : paddNum(date.getHours())  //时
        ,mm : paddNum(date.getMinutes()) //分
        ,ss : date.getSeconds() //秒
    }
    format || (format = "yyyy-MM-dd hh:mm:ss");
    return format.replace(/([a-z])(\1)*/ig,function(m){return cfg[m];});
}

////替换所有
//String.prototype.replaceAll = function(s1,s2) {
//    return this.replace(new RegExp(s1, "gm"), s2); //g全局
//}

var tdValue = "";

//设置档期
function setSchedule(obj){
    var shopId = document.getElementById("shopId").value;
    var base = document.getElementById("base").value;
    //档期时间集合
    var fullMonth = thisMonth;
    if(fullMonth<10){
        fullMonth = "0"+(fullMonth);
    }
    var scheduleList = "";
    $.ajax({
        url:base+'/schedule/doSchedule',
        type:'post',
        dateType:'json',
        data:'shopId='+shopId+"&date="+thisYear+"-"+fullMonth+"-03",
        timeout:10000*10,
        success:function(data){
            //档期
            var schedule = data.schedules;
            //当前月份
            var fullMonth;
            var thisTd = obj.getElementsByTagName("TD");

            for(var k = 0;k<thisTd.length;k++){
                var day =  thisTd[k].getElementsByTagName("span")[0].innerHTML;
                //用于显示到日历上面
                var day2 = thisTd[k].getElementsByTagName("span")[0].innerHTML;

                fullMonth = thisTd[k].getElementsByTagName("span")[0].id;
                var tdHTML = thisTd[k];
                if(day<10){
                    day = "0"+(day);
                }
                if(fullMonth<10){
                    fullMonth = "0"+(fullMonth);
                }

                //今天
                var thisDay = thisYear+"-"+fullMonth+"-"+day;
                for(var i = 0;i<schedule.length;i++){
                    for(var j = 0;j<schedule[i].scheuleEvts.length;j++){
                        var thisDate = null;
                        if(schedule[i].workerSchedule.scheduleType==0){
                            thisDate = formatDate(new Date(schedule[i].scheuleEvts[j].stime),"yyyy-MM-dd");

                            if(thisDay==thisDate){
                                tdHTML.innerHTML = "";
                                var serviceType = '<p>服务类型：'+schedule[i].scheuleEvts[j].serviceName+'</p>';
                                if($("#schTname").val() == "CEHUASHI001"){
                                    serviceType = "";
                                }
                                if(schedule[i].scheuleEvts.length==1||(j+1)==schedule[i].scheuleEvts.length){
                                    tdValue += '<p>预订人：'+schedule[i].scheuleEvts[j].contactName.substring(0,1)+'**</p>'+
                                        serviceType+
                                        '<p>服务价格：'+schedule[i].scheuleEvts[j].servicePrice/100+'</p>'+
                                        '<p>服务时间：'+formatDate(new Date(schedule[i].scheuleEvts[j].stime),"yyyy-MM-dd")+" - "+formatDateForHour(new Date(schedule[i].scheuleEvts[j].stime).getHours(),new Date(schedule[i].scheuleEvts[j].etime).getHours())+'</p> '+
                                        '<p style="padding-left: 60px;">'+schedule[i].scheuleEvts[j].address.replace(",","-")+'</p> ';
                                }else{
                                    tdHTML.getElementsByTagName("span")[0].className = "cur";
                                    tdHTML.innerHTML = tdHTML.innerHTML + '<i class="cur2">已预订</i>';
                                    tdValue += '<p>预订人：'+schedule[i].scheuleEvts[j].contactName.substring(0,1)+'**</p>'+
                                        serviceType+
                                        '<p>服务价格：'+schedule[i].scheuleEvts[j].servicePrice/100+'</p>'+
                                        '<p>服务时间：'+formatDate(new Date(schedule[i].scheuleEvts[j].stime),"yyyy-MM-dd")+" - "+formatDateForHour(new Date(schedule[i].scheuleEvts[j].stime).getHours(),new Date(schedule[i].scheuleEvts[j].etime).getHours())+'</p> '+
                                        '<p style="padding-left: 60px;">'+schedule[i].scheuleEvts[j].address.replace(",","-")+'</p> '+
                                        '<p style="border-bottom:1px dashed #ddd; margin:5px 0px; *height:1px;"></p>';
                                }
                            }
                        }
                    }
                    if(schedule[i].workerSchedule.scheduleType==1){
                        thisDate = formatDate(new Date(schedule[i].workerSchedule.date),"yyyy-MM-dd");
                        if(thisDay==thisDate){
                            //if(tdHTML.childNodes[0].nodeName == "SPAN"){
                            //    day = thisTd[k].getElementsByTagName("span")[0].innerHTML;
                            //    tdHTML.innerHTML  = '<span class="gray" id="'+fullMonth+'">'+day+'</span>'
                            //
                            //}
                            tdHTML.getElementsByTagName("span")[0].className = "cur";
                            tdHTML.getElementsByTagName("span")[0].style.background = "#bfbfbf";
                            tdHTML.innerHTML = tdHTML.innerHTML + '<i class="cur2">今日忙</i>';
                        }

                    }

                    if(tdHTML.innerHTML==""){
                        tdHTML.innerHTML ='<span id="'+fullMonth+day+'" class="cur">'+day2+'</span>' +
                            '<i class="cur2">已预订</i>'+
                            '<div style="display: none;left:65px; top:-50px;" id="info'+fullMonth+day+'" class="buyInfo">'+tdValue+'</div>';
                    }
                    tdValue = "";
                }
            }

        },
        error:function(){
//            alert("对不起，请稍后再试！");
        }
    });
}

function formatDateForHour(st,et){
    if (st >= 7 && et <= 14) {
        return "午宴";
    }else if(st >= 18 && et <= 20) {
        return "晚宴";
    }else{
        return "全天";
    }
}



另一个js:


var today = new Date();
var  thisMonth = today.getMonth()+1;
var  thisYear= today.getFullYear();

//日历
window.onload = function(){
    viewSchedule();
}

function viewSchedule (){
    var table = document.getElementById("dateTable");
    var yearS = document.getElementById("monthInfo");
    var dayNum = 0;
    var fullMonth = thisMonth;
    if(fullMonth<10){
        fullMonth = "0"+(fullMonth);
    }
    yearS.innerHTML = thisYear+'年'+(fullMonth)+'月';


    //初始化日期
    var aTD = table.getElementsByTagName("TD");
    //获取本月一号
    today.setFullYear(thisYear);
    today.setMonth(thisMonth-1);
    today.setDate(1);
    //日期
    dayNum = monthDay(thisYear, thisMonth);
    //获取当前月第一天是礼拜几
    var monthfirstday = today.getDay();
    for (var j = 0; j < 42; j++) {
        aTD[j].innerHTML = '';
    }
    for (var i = 0; i < dayNum; i++) {
        aTD[i + monthfirstday].innerHTML = '<span id="' + (i + 1) + '">' + (i + 1) + '</span>';
    }
    //获取上一个月有多少天
    var exDayNum = monthDay(thisYear, thisMonth - 1);
    //if(today.getDay()==0) {
    //    var i = 0;
    //    for (i; i < dayNum; i++) {
    //        aTD[i].innerHTML = '<span id="'+thisMonth+'">'+(i + 1)+'</span>';
    //    }
    //    var k = 1;
    //    for (i; i < 42; i++) {
    //        //aTD[i].innerHTML = '<span id="'+(thisMonth+1)+'">'+(k)+'</span>';
    //        k++;
    //    }
    //}else if(today.getDay()==1) {
    //    var n = exDayNum - 0;
    //    var i = 0;
    //    for (n; n <= exDayNum; n++) {
    //        //aTD[i].innerHTML = '<span id="'+(thisMonth-1)+'">'+(n)+'</span>';
    //        i++;
    //    }
    //    var j = 0;
    //    for (j; j < dayNum; j++) {
    //        aTD[i].innerHTML = '<span id="'+thisMonth+'">'+(j + 1)+'</span>';
    //        i++;
    //    }
    //    var k = 1;
    //    for(i;i<42;i++){
    //        //aTD[i].innerHTML = '<span id="'+(thisMonth+1)+'">'+(k)+'</span>';
    //        k++;
    //    }
    //}else if(today.getDay()==2) {
    //    var n = exDayNum - 1;
    //    var i = 0;
    //    for (n; n <= exDayNum; n++) {
    //        //aTD[i].innerHTML = '<span id="'+(thisMonth-1)+'">'+(n)+'</span>';
    //        i++;
    //    }
    //    var j = 0;
    //    for (j; j < dayNum; j++) {
    //        aTD[i].innerHTML = '<span id="'+thisMonth+'">'+(j + 1)+'</span>';
    //        i++;
    //    }
    //    var k = 1;
    //    for(i;i<42;i++){
    //       // aTD[i].innerHTML = '<span id="'+(thisMonth+1)+'">'+(k)+'</span>';
    //        k++;
    //    }
    //}else if(today.getDay()==3) {
    //    var n = exDayNum - 2;
    //    var i = 0;
    //    for (n; n <= exDayNum; n++) {
    //       // aTD[i].innerHTML = '<span id="'+(thisMonth-1)+'">'+(n)+'</span>';
    //        i++;
    //    }
    //    var j = 0;
    //    for (j; j < dayNum; j++) {
    //        aTD[i].innerHTML = '<span id="'+thisMonth+'">'+(j + 1)+'</span>';
    //        i++;
    //    }
    //    var k = 1;
    //    for(i;i<42;i++){
    //       // aTD[i].innerHTML = '<span id="'+(thisMonth+1)+'">'+(k)+'</span>';
    //        k++;
    //    }
    //}else if(today.getDay()==4) {
    //    var n = exDayNum - 3;
    //    var i = 0;
    //    for (n; n <= exDayNum; n++) {
    //       // aTD[i].innerHTML = '<span id="'+(thisMonth-1)+'">'+(n)+'</span>';
    //        i++;
    //    }
    //    var j = 0;
    //    for (j; j < dayNum; j++) {
    //        aTD[i].innerHTML = '<span id="'+thisMonth+'">'+(j + 1)+'</span>';
    //        i++;
    //    }
    //    var k = 1;
    //    for(i;i<42;i++){
    //        //aTD[i].innerHTML = '<span id="'+(thisMonth+1)+'">'+(k)+'</span>';
    //        k++;
    //    }
    //}else if(today.getDay()==5) {
    //    var n = exDayNum - 4;
    //    var i = 0;
    //    for (n; n <= exDayNum; n++) {
    //       // aTD[i].innerHTML = '<span id="'+(thisMonth-1)+'">'+(n)+'</span>';
    //        i++;
    //    }
    //    var j = 0;
    //    for (j; j < dayNum; j++) {
    //        aTD[i].innerHTML = '<span id="'+thisMonth+'">'+(j + 1)+'</span>';
    //        i++;
    //    }
    //    var k = 1;
    //    for(i;i<42;i++){
    //       // aTD[i].innerHTML = '<span id="'+(thisMonth+1)+'">'+(k)+'</span>';
    //        k++;
    //    }
    //}else if(today.getDay()==6) {
    //    var n = exDayNum-5;
    //    var i = 0;
    //    for(n;n<=exDayNum;n++){
    //        //aTD[i].innerHTML = '<span id="'+(thisMonth-1)+'">'+(n)+'</span>';
    //        i++;
    //    }
    //    var j = 0;
    //    for(j;j<dayNum;j++){
    //        aTD[i].innerHTML = '<span id="'+thisMonth+'">'+(j + 1)+'</span>';
    //        i++;
    //    }
    //    var k =  1;
    //    for(i;i<42;i++){
    //        //aTD[i].innerHTML = '<span id="'+(thisMonth+1)+'">'+(k)+'</span>';
    //        k++;
    //    }
    //}
    //上一个月
    function previous (){
        var  thisM = thisMonth;
        var  thisY= thisYear;
        if(thisM==1){
            thisM = 12;
            thisY = thisY-1;
        }else{
            thisM = thisM-1;
        }
        thisYear = thisY;
        thisMonth = thisM;
        viewSchedule();

    }

    //下一个月
    function next (){
        var  thisM = thisMonth;
        var  thisY= thisYear;
        if(thisM==12){
            thisM = 1;
            thisY = thisY+1;
        }else{
            thisM = thisM+1;
        }
        thisYear = thisY;
        thisMonth = thisM;
        viewSchedule();

    }

    //是否为闰年
    function isLeapYear(year){
        if(year%4==0 && year%100!=0){
            return true;
        }
        else{
            if(year%400==0){
                return true;
            }
            else{
                return false;
            }
        }
    }

    //判断每月有几天
    function monthDay(year,month){
        if(month==1 || month==3 || month==5 || month==7 || month==8 || month==10 || month==12 || month==0){
            return 31;
        }else if(month==4 || month==6 || month==9 || month==11){
            return  30;
        }else if(month==2 && isLeapYear(year)){
            return  29;
        }else{
            return 28;
        }
    }


    function nowDay(){
        var monthStart = document.getElementById("monthStart");
        var monthNext = document.getElementById("monthNext");

        monthStart.onclick = function(){
            previous();
        }
        monthNext.onclick = function(){
            next();
        }
    }
    nowDay();
    setSchedule(table);
    //$("#svrcitys").html(table);
}


//格式化日期,
function formatDate(date,format){
    var paddNum = function(num){
        num += "";
        return num.replace(/^(\d)$/,"0$1");
    }
    //指定格式字符
    var cfg = {
        yyyy : date.getFullYear() //年 : 4位
        ,yy : date.getFullYear().toString().substring(2)//年 : 2位
        ,M  : date.getMonth() + 1  //月 : 如果1位的时候不补0
        ,MM : paddNum(date.getMonth() + 1) //月 : 如果1位的时候补0
        ,d  : date.getDate()   //日 : 如果1位的时候不补0
        ,dd : paddNum(date.getDate())//日 : 如果1位的时候补0
        ,hh : date.getHours()  //时
        ,HH : paddNum(date.getHours())  //时
        ,mm : paddNum(date.getMinutes()) //分
        ,ss : date.getSeconds() //秒
    }
    format || (format = "yyyy-MM-dd hh:mm:ss");
    return format.replace(/([a-z])(\1)*/ig,function(m){return cfg[m];});
}
var tdValue = "";

//设置档期
function setSchedule(obj) {
    var pUID = $("#pUID").val();
    //var shopId = document.getElementById("shopId").value;
    //var base = document.getElementById("base").value;
    //档期时间集合
    var fullMonth = thisMonth;
    if (fullMonth < 10) {
        fullMonth = "0" + (fullMonth);
    }
    var scheduleList = "";
    var parameter = 'action=usercalendar&uid=' + pUID + '&thisYear=' + thisYear + '&fullMonth=' + fullMonth;
    $.ajax({
        type: "Post",
        async: true,
        cache: false,
        url: "/ashx/web/web.ashx",
        data: parameter,
        dataType: "json",
        success: function (data) {
            //档期
            // var schedule = data.schedules;
            //当前月份
            var fullMonth;
            var thisTd = obj.getElementsByTagName("TD");
            //for (var k = 0; k < thisTd.length; k++) {
            //    var day = thisTd[k].getElementsByTagName("span")[0].innerHTML;
            //    alert(day);
            //    //用于显示到日历上面
            //    var day2 = thisTd[k].getElementsByTagName("span")[0].innerHTML;
            //    fullMonth = thisTd[k].getElementsByTagName("span")[0].id;
            //    var tdHTML = thisTd[k];
            //    if (day < 10) {
            //        day = "0" + (day);
            //    }
            //    if (fullMonth < 10) {
            //        fullMonth = "0" + (fullMonth);
            //    }
            //    //今天
            //var thisDay = thisYear + "-" + fullMonth + "-" + day;
            //    if (data.ObjDataList.length > 0) {
            $.each(data.ObjDataList, function (i, item) {
                var thisDate = item.MTSDate;
                var d = new Date(thisDate);
                var MTSState = item.MTSState;
                var AMIsOrder = item.AMIsOrder;
                var PMIsOrder = item.PMIsOrder;
                var tday = d.getDate();
                
                //if (thisDay == thisDate) {
                //判断状态
                //var busy = "";
                //if (item.AMISBusy == 1 && item.PMISBusy == 1) {
                //    busy = "今日忙";
                   
                //}
                //else {
                //    if (item.AMISBusy == 1) {
                //        busy = "上午忙";
                //        $("#" + tday).addClass("cur");
                //        $("#" + tday).css({ background: "#bfbfbf" });
                //        $("#" + tday).append('<i class="cur2">' + busy + '</i>');
                //    }
                //    else if (item.PMISBusy == 1) {
                //        busy = "下午忙";
                //        $("#" + tday).addClass("cur");
                //        $("#" + tday).css({ background: "#bfbfbf" });
                //        $("#" + tday).append('<i class="cur2">' + busy + '</i>');
                //    }
                //}
                //var yuding = "";
                //if (AMIsOrder == 1 && PMIsOrder == 1) {
                //    yuding = "已预订";
                //}
                //else {
                //    if (AMIsOrder ==1)
                //    {
                //        yuding = "AM已约";
                //    }
                //    else if (PMIsOrder ==1)
                //    {
                //        yuding = "PM已约";
                //    }
                //}
                if (AMIsOrder == 1 && item.MTSAM == "" && PMIsOrder == 1 && item.MTSPM == "")
                {
                    $("#" + tday).addClass("cur");
                    $("#" + tday).css({ background: "#bfbfbf" });
                    $("#" + tday).append('<i class="cur2">今日忙</i>');
                }
                else if (AMIsOrder == 1 && item.MTSAM != "" && PMIsOrder == 1 && item.MTSPM != "")
                {
                    $("#" + tday).addClass("cur");
                    $("#" + tday).append('<i class="cur2">已预订</i>');
                }
                else if (AMIsOrder == 1 && item.MTSAM == "")
                {
                    $("#" + tday).addClass("cur");
                    $("#" + tday).css({ background: "#bfbfbf" });
                    $("#" + tday).append('<i class="cur2">上午忙</i>');
                }
                else if (PMIsOrder == 1 && item.MTSPM == "") {
                    $("#" + tday).addClass("cur");
                    $("#" + tday).css({ background: "#bfbfbf" });
                    $("#" + tday).append('<i class="cur2">下午忙</i>');
                }
                else if (AMIsOrder == 1 && item.MTSAM != "")
                {
                    $("#" + tday).addClass("cur");
                    $("#" + tday).append('<i class="cur2">AM已约</i>');
                }
                else if (PMIsOrder == 1 && item.MTSPM != "") {
                    $("#" + tday).addClass("cur");
                    $("#" + tday).append('<i class="cur2">PM已约</i>');
                }

                //if (MTSState == 1) {
                //    //tdHTML.getElementsByTagName("span")[0].className = "cur";
                //    //tdHTML.getElementsByTagName("span")[0].style.background = "#bfbfbf";
                //    //tdHTML.innerHTML = tdHTML.innerHTML + '<i class="cur2">今日忙</i>';
                //    $("#" + tday).addClass("cur");
                //    $("#" + tday).css({ background: "#bfbfbf" });
                //    if (AMIsOrder == 1 && PMIsOrder == 1) {
                //        $("#" + tday).append('<i class="cur2">今日忙</i>');
                //    }
                //    else {
                //        if (AMIsOrder == 1)
                //        {
                //            $("#" + tday).append('<i class="cur2">上午忙</i>');
                //        }
                //        else if (PMIsOrder ==1)
                //        {
                //            $("#" + tday).append('<i class="cur2">下午忙</i>');
                //        }
                //    }
                    
                //}
                //else if (MTSState == 2) {
                //    //tdHTML.getElementsByTagName("span")[0].className = "cur";
                //    //tdHTML.innerHTML = tdHTML.innerHTML + '<i class="cur2">已预订</i>';
                //    $("#" + tday).addClass("cur");
                //    if (AMIsOrder == 1 && PMIsOrder == 1) {
                //        $("#" + tday).append('<i class="cur2">已预订</i>');
                //    }
                //    else {
                //        if (AMIsOrder == 1) {
                //            $("#" + tday).append('<i class="cur2">AM已约</i>');
                //        }
                //        else if (PMIsOrder == 1) {
                //            $("#" + tday).append('<i class="cur2">PM已约</i>');
                //        }
                //    }
               
                //}
                //else {
                //    //tdHTML.getElementsByTagName("span")[0].className = "cur";
                //    //tdHTML.getElementsByTagName("span")[0].style.background = "#bfbfbf";
                //    //tdHTML.innerHTML = tdHTML.innerHTML + '<i class="cur2">今日忙</i>';
                //    $("#" + tday).addClass("cur");
                //    $("#" + tday).css({ background: "#bfbfbf" });
                //    $("#" + tday).append('<i class="cur2">今日忙</i>');
                //}
                //  }
            });
            //    }
            //}
        }
    });
}

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>blog式日历控件_www.jb51.net_脚本之家</title>
</head>
<body>
    <script type="text/javascript">
        var $ = function (id) {
            return "string" == typeof id ? document.getElementById(id) : id;
        };

        var Class = {
            create: function () {
                return function () {
                    this.initialize.apply(this, arguments);
                }
            }
        }

        Object.extend = function (destination, source) {
            for (var property in source) {
                destination[property] = source[property];
            }
            return destination;
        }


        var Calendar = Class.create();
        Calendar.prototype = {
            initialize: function (container, options) {
                this.Container = $(container);//容器(table结构)
                this.Days = [];//日期对象列表

                this.SetOptions(options);

                this.Year = this.options.Year;
                this.Month = this.options.Month;
                this.SelectDay = this.options.SelectDay ? new Date(this.options.SelectDay) : null;
                this.onSelectDay = this.options.onSelectDay;
                this.onToday = this.options.onToday;
                this.onFinish = this.options.onFinish;

                this.Draw();
            },
            //设置默认属性
            SetOptions: function (options) {
                this.options = {//默认值
                    Year: new Date().getFullYear(),//显示年
                    Month: new Date().getMonth() + 1,//显示月
                    SelectDay: null,//选择日期
                    onSelectDay: function () { },//在选择日期触发
                    onToday: function () { },//在当天日期触发
                    onFinish: function () { }//日历画完后触发
                };
                Object.extend(this.options, options || {});
            },
            //上一个月
            PreMonth: function () {
                //先取得上一个月的日期对象
                var d = new Date(this.Year, this.Month - 2, 1);
                //再设置属性
                this.Year = d.getFullYear();
                this.Month = d.getMonth() + 1;
                //重新画日历
                this.Draw();
            },
            //下一个月
            NextMonth: function () {
                var d = new Date(this.Year, this.Month, 1);
                this.Year = d.getFullYear();
                this.Month = d.getMonth() + 1;
                this.Draw();
            },
            //画日历
            Draw: function () {
                //用来保存日期列表
                var arr = [];
                //用当月第一天在一周中的日期值作为当月离第一天的天数
                for (var i = 1, firstDay = new Date(this.Year, this.Month - 1, 1).getDay() ; i <= firstDay; i++) { arr.push(" "); }
                //用当月最后一天在一个月中的日期值作为当月的天数
                for (var i = 1, monthDay = new Date(this.Year, this.Month, 0).getDate() ; i <= monthDay; i++) { arr.push(i); }

                var frag = document.createDocumentFragment();

                this.Days = [];

                while (arr.length > 0) {
                    //每个星期插入一个tr
                    var row = document.createElement("tr");
                    //每个星期有7天
                    for (var i = 1; i <= 7; i++) {
                        var cell = document.createElement("td");
                        cell.innerHTML = " ";

                        if (arr.length > 0) {
                            var d = arr.shift();
                            cell.innerHTML = d;
                            if (d > 0) {
                                this.Days[d] = cell;
                                //判断是否今日
                                if (this.IsSame(new Date(this.Year, this.Month - 1, d), new Date())) { this.onToday(cell); }
                                //判断是否选择日期
                                if (this.SelectDay && this.IsSame(new Date(this.Year, this.Month - 1, d), this.SelectDay)) { this.onSelectDay(cell); }
                            }
                        }
                        row.appendChild(cell);
                    }
                    frag.appendChild(row);
                }

                //先清空内容再插入(ie的table不能用innerHTML)
                while (this.Container.hasChildNodes()) { this.Container.removeChild(this.Container.firstChild); }
                this.Container.appendChild(frag);

                this.onFinish();
            },
            //判断是否同一日
            IsSame: function (d1, d2) {
                return (d1.getFullYear() == d2.getFullYear() && d1.getMonth() == d2.getMonth() && d1.getDate() == d2.getDate());
            }
        };

    </script>
    <style type="text/css">
        .Calendar {
            font-family: Verdana;
            font-size: 12px;
            background-color: #e0ecf9;
            text-align: center;
            width: 200px;
            height: 160px;
            padding: 10px;
            line-height: 1.5em;
        }

            .Calendar a {
                color: #1e5494;
            }

            .Calendar table {
                width: 100%;
                border: 0;
            }

                .Calendar table thead {
                    color: #acacac;
                }

                .Calendar table td {
                    font-size: 11px;
                    padding: 1px;
                }

        #idCalendarPre {
            cursor: pointer;
            float: left;
            padding-right: 5px;
        }

        #idCalendarNext {
            cursor: pointer;
            float: right;
            padding-right: 5px;
        }

        #idCalendar td.onToday {
            font-weight: bold;
            color: #C60;
        }

        #idCalendar td.onSelect {
            font-weight: bold;
        }
    </style>
    <div class="Calendar">
        <div id="idCalendarPre"><<</div>
        <div id="idCalendarNext">>></div>
        <span id="idCalendarYear">2008</span>年 <span id="idCalendarMonth">8</span>月
        <table cellspacing="0">
            <thead>
                <tr>
                    <td>日</td>
                    <td>一</td>
                    <td>二</td>
                    <td>三</td>
                    <td>四</td>
                    <td>五</td>
                    <td>六</td>
                </tr>
            </thead>
            <tbody id="idCalendar"></tbody>
        </table>
    </div>
    <script language="JavaScript">

        var cale = new Calendar("idCalendar", {
            SelectDay: new Date().setDate(10),
            onSelectDay: function (o) { o.className = "onSelect"; },
            onToday: function (o) { o.className = "onToday"; },
            onFinish: function () {
                $("idCalendarYear").innerHTML = this.Year; $("idCalendarMonth").innerHTML = this.Month;
                var flag = [10, 15, 20];
                for (var i = 0, len = flag.length; i < len; i++) {
                    this.Days[flag[i]].innerHTML = "<a href='javascript:void(0);' onclick=\"alert('日期是:" + this.Year + "/" + this.Month + "/" + flag[i] + "');return false;\">" + flag[i] + "</a>";
                }
            }
        });

        $("idCalendarPre").onclick = function () { cale.PreMonth(); }
        $("idCalendarNext").onclick = function () { cale.NextMonth(); }

    </script>
</body>
</html>