`

日历控件

 
阅读更多
var DateConversion = (function() {  
    var constants = {  
        LUNARINFO : new Array(  
                /* 1900 */  
                0x04bd8, 0x04ae0, 0x0a570, 0x054d5, 0x0d260, 0x0d950, 0x16554,  
                0x056a0, 0x09ad0, 0x055d2, 0x04ae0, 0x0a5b6, 0x0a4d0, 0x0d250,  
                0x1d255, 0x0b540, 0x0d6a0, 0x0ada2, 0x095b0, 0x14977, 0x04970,  
                0x0a4b0, 0x0b4b5, 0x06a50, 0x06d40, 0x1ab54, 0x02b60, 0x09570,  
                0x052f2, 0x04970, 0x06566, 0x0d4a0, 0x0ea50, 0x06e95, 0x05ad0,  
                0x02b60, 0x186e3, 0x092e0, 0x1c8d7, 0x0c950, 0x0d4a0, 0x1d8a6,  
                0x0b550, 0x056a0, 0x1a5b4, 0x025d0, 0x092d0, 0x0d2b2, 0x0a950,  
                0x0b557, 0x06ca0, 0x0b550, 0x15355, 0x04da0, 0x0a5d0, 0x14573,  
                0x052d0, 0x0a9a8, 0x0e950, 0x06aa0, 0x0aea6, 0x0ab50, 0x04b60,  
                0x0aae4, 0x0a570, 0x05260, 0x0f263, 0x0d950, 0x05b57, 0x056a0,  
                0x096d0, 0x04dd5, 0x04ad0, 0x0a4d0, 0x0d4d4, 0x0d250, 0x0d558,  
                0x0b540, 0x0b5a0, 0x195a6, 0x095b0, 0x049b0, 0x0a974, 0x0a4b0,  
                0x0b27a, 0x06a50, 0x06d40, 0x0af46, 0x0ab60, 0x09570, 0x04af5,  
                0x04970, 0x064b0, 0x074a3, 0x0ea50, 0x06b58, 0x055c0, 0x0ab60,  
                0x096d5, 0x092e0, 0x0c960, 0x0d954, 0x0d4a0, 0x0da50, 0x07552,  
                0x056a0, 0x0abb7, 0x025d0, 0x092d0, 0x0cab5, 0x0a950, 0x0b4a0,  
                0x0baa4, 0x0ad50, 0x055d9, 0x04ba0, 0x0a5b0, 0x15176, 0x052b0,  
                0x0a930, 0x07954, 0x06aa0, 0x0ad50, 0x05b52, 0x04b60, 0x0a6e6,  
                0x0a4e0, 0x0d260, 0x0ea65, 0x0d530, 0x05aa0, 0x076a3, 0x096d0,  
                0x04bd7, 0x04ad0, 0x0a4d0, 0x1d0b6, 0x0d250, 0x0d520, 0x0dd45,  
                0x0b5a0, 0x056d0, 0x055b2, 0x049b0, 0x0a577, 0x0a4b0, 0x0aa50,  
                0x1b255, 0x06d20, 0x0ada0,/* 2049 */  
                // 下面的是从 2050 到 2100 年的  
                0x14b63, /* 2050 */  
                0x09370, 0x049f8, 0x04970, 0x064b0, 0x168a6, /* 2055 */  
                0x0ea50, 0x06b20, 0x1a6c4, 0x0aae0, 0x0a2e0, /* 2060 */  
                0x0d2e3, 0x0c960, 0x0d557, 0x0d4a0, 0x0da50, /* 2065 */  
                0x05d55, 0x056a0, 0x0a6d0, 0x055d4, 0x052d0, /* 2070 */  
                0x0a9b8, 0x0a950, 0x0a4a0, 0x0b6a6, 0x0ad50, /* 2075 */  
                0x055a0, 0x0aba0, 0x0a5b0, 0x052b0, 0x0b273, /* 2080 */  
                0x06930, 0x07337, 0x06aa0, 0x0ad50, 0x14b55, /* 2085 */  
                0x04b60, 0x0a570, 0x054e4, 0x0d260, 0x0e968, /* 2090 */  
                0x0d520, 0x0daa0, 0x16aa6, 0x056d0, 0x04ae0, /* 2095 */  
                0x0a9d4, 0x0a4d0, 0x0d150, 0x0f252, 0x0d520 /* 2100 */),  
        GAN : new Array("甲", "乙", "丙", "丁", "戊", "己", "庚", "辛", "壬", "癸"),  
        ZHI : new Array("子", "丑", "寅", "卯", "辰", "巳", "午", "未", "申", "酉", "戌",  
                "亥")  
    };  
    var cd = function(strDate) {  
        var date, year, month, day, displayDay, displayMonth,result,rDay,rMOnth;  
        this.setDate = function(strDate) {  
            if (strDate instanceof Date){
                date = strDate;
            }else if (typeof(strDate) == 'string'){  
                date = this.strToDate(strDate);  
            } else {  
                date = new Date();  
            }  
        };  
        this.getDate = function() {  
            return  date;   
        };  
        this.getResult = function(){  
            return result;  
        };  
        this.getRDay = function(){
            return rDay;
        };
        this.getRMonth = function(){
            return rMOnth;
        }

        this.setDate(strDate);  
        var res =lunar(new Date(date.getFullYear(), date.getMonth(),date.getDate()));  
        var cl = '<font color="red" STYLE="font-size:9pt;">';  
        var tt = cyclical(res[0] - 1900 + 36) +'('+res[0] + ')年'+(res[1] ==true? '闰' : '')
                + cDay(res[2], res[3]);  
         result =cl + tt + '</font>'; 
         var rDay = cRDay(res[3]);
         var rMOnth = cRMonth(res[2]);
    };  
    cd.getConstant = function(name) {  
        return constants[name];  
    };  
    // ==== 传入 offset 传回干支, 0=甲子  
    function cyclical(num) {  
        return (DateConversion.getConstant('GAN')[num % 10] + DateConversion  
                .getConstant('ZHI')[num % 12]);  
    };  
    // ==== 传回农历 y年的总天数  
    function lYearDays(y) {  
        var i, sum = 348;  
        for (i = 0x8000; i > 0x8; i >>= 1)  
            sum += (DateConversion.getConstant('LUNARINFO')[y - 1900] & i)  
                    ? 1  
                    : 0;  
        return (sum + leapDays(y));  
    };  
    // ==== 传回农历 y年闰月的天数  
    function leapDays(y) {  
        if (leapMonth(y))  
            return ((DateConversion.getConstant('LUNARINFO')[y - 1900] & 0x10000)  
                    ? 30  
                    : 29);  
        else  
            return (0);  
    };  
    // ==== 传回农历 y年闰哪个月 1-12 , 没闰传回 0  
    function leapMonth(y) {  
        return (DateConversion.getConstant('LUNARINFO')[y - 1900] & 0xf);  
    };  
    // ====================================== 传回农历 y年m月的总天数  
    function monthDays(y, m) {  
        return (DateConversion.getConstant('LUNARINFO')[y - 1900] & (0x10000 >> m))  
                ? 30  
                : 29;  
    };  
    // ==== 中文日期  
    function cDay(m, d) {  
        var nStr1 = new Array('日', '一', '二', '三', '四', '五', '六', '七', '八', '九',  
                '十');  
        var nStr2 = new Array('初', '十', '廿', '卅', ' ');  
        var s;  
        if (m > 10) {  
            s = '十' + nStr1[m - 10];  
        } else {  
            s = nStr1[m];  
        }  
        s += '月';  
        switch (d) {  
            case 10 :  
                s += '初十';  
                break;  
            case 20 :  
                s += '二十';  
                break;  
            case 30 :  
                s += '三十';  
                break;  
            default :  
                s += nStr2[Math.floor(d / 10)];  
                s += nStr1[d % 10];  
        }  
        return (s);  
    };  
    function cRMonth(m) {  
        var nStr1 = new Array('日', '一', '二', '三', '四', '五', '六', '七', '八', '九',  
        '十');  
        var nStr2 = new Array('初', '十', '廿', '卅', ' ');  
        var s;  
        if (m > 10) {  
            s = '十' + nStr1[m - 10];  
        } else {  
            s = nStr1[m];  
        }  
        s += '月';  
        return (s); 
    };
    function cRDay(d) {  
        var nStr1 = new Array('日', '一', '二', '三', '四', '五', '六', '七', '八', '九',  
                '十');  
        var nStr2 = new Array('初', '十', '廿', '卅', ' ');  
        var s='';   
        switch (d) {  
            case 10 :  
                s += '初十';  
                break;  
            case 20 :  
                s += '二十';  
                break;  
            case 30 :  
                s += '三十';  
                break;  
            default :  
                s += nStr2[Math.floor(d / 10)];  
                s += nStr1[d % 10];  
        }  
        return (s);  
    };  
    // ==== 算出农历, 传入日期物件, 传回农历日期物件  
    // ==== 该物件属性有 .year .month .day .isLeap .yearCyl .dayCyl .monCyl  
    function lunar(objDate) {  
        var i, leap = 0, temp = 0;  
        var baseDate = new Date(1900, 0, 31);  
        var offset = (objDate - baseDate) / 86400000;  
  
        // this.dayCyl = offset + 40;  
        var monCyl = 14;  
  
        for (i = 1900; i < 2100 && offset > 0; i++) {  
            temp = lYearDays(i);  
            offset -= temp;  
            monCyl += 12;  
        }  
        if (offset < 0) {  
            offset += temp;  
            i--;  
            monCyl -= 12;  
        }  
  
        var year = i;  
        // this.yearCyl = i - 1864;  
  
        leap = leapMonth(i); // 闰哪个月  
        var isLeap = false;  
  
        for (i = 1; i < 13 && offset > 0; i++) {  
            // 闰月  
            if (leap > 0 && i == (leap + 1) && isLeap == false) {  
                --i;  
                isLeap = true;  
                temp = leapDays(year);  
            } else {  
                temp = monthDays(year, i);  
            }  
  
            // 解除闰月  
            if (isLeap == true && i == (leap + 1)) {  
                isLeap = false;  
            }  
  
            offset -= temp;  
            if (isLeap == false) {  
                monCyl++;  
            }  
        }  
  
        if (offset == 0 && leap > 0 && i == leap + 1) {  
            if (isLeap) {  
                isLeap = false;  
            } else {  
                isLeap = true;  
                --i;  
                --monCyl;  
            }  
        }  
  
        if (offset < 0) {  
            offset += temp;  
            --i;  
            --monCyl;  
        }  
		//年(闰)月日
        return [year,isLeap,i,offset + 1];  
    }  
    return cd;  
})();  
  
DateConversion.prototype = {  
    strToDate : function(dateStr,separator){ 
        if(!separator){ 
            separator="-"; 
        } 
        var dateArr = dateStr.split(separator); 
        var year = parseInt(dateArr[0]); 
        var month; 
        //处理月份为04这样的情况                          
        if(dateArr[1].indexOf("0") == 0){ 
            month = parseInt(dateArr[1].substring(1)); 
        }else{ 
            month = parseInt(dateArr[1]); 
        } 
        var day = parseInt(dateArr[2]); 
        var date = new Date(year,month -1,day); 
        return date; 
    }  
}; 

<!DOCTYPE HTML>
<html>
<head>
<title>每日签到</title>
<script type="text/javascript" src="jquery-1.9.1.js"></script>
<script type="text/javascript" src="DateConversion.js"></script>
<style type="text/css">
.table {
	margin-bottom: 0px;
	border: 0px;
	width: 100%;
}

.table>tbody>tr>td {
	height: 46px;
	//width: 40px;
	padding: 4px;
	font-size: 16px;
}

.score {
	float: right;
	font-size: 10px;
	color: #a0a0a0
}

.table-bordered>thead>tr>th {
	background-color: #FF8888;
	border: 0px;
}

.prevMonth,.nextMonth {
	color: #a0a0a0;
}

.thisDay {
	background-color: #FFC8C8
}
.dailyAttendance{
	background-color: #c8ffc8
}

b.rtop,b.rbottom {
	display: block;
	background: #FFF
}

b.rtop b {
	display: block;
	height: 1px;
	overflow: hidden;
	background: #FF8888;
}

b.rbottom b {
	display: block;
	height: 1px;
	overflow: hidden;
	background: #DDDDDD;
}

b.r1 {
	margin: 0 5px
}

b.r2 {
	margin: 0 3px
}

b.r3 {
	margin: 0 2px
}

b.rtop b.r4,b.rbottom b.r4 {
	margin: 0 1px;
	height: 2px
}
</style>
<SCRIPT LANGUAGE="JavaScript">	
	$(function() {
		var Calendar = (function(){
			return function(strDate){
				 var date, year, month,result,startDate,endDate,curDate;
				 this.getYear = function(){
					 return year;
				 };
				 this.setYear = function(v_year){
					 year = v_year;
				 };
				 this.getMonth = function(){
					 return month;
				 };
				 this.setMonth = function(v_month){
					 month = v_month;
				 };
				 this.getDate = function(){
					 return date;
				 };
				 this.setResult = function(v_result){
					 result = v_result;
				 };
				 this.getResult = function(){
					 return result;
				 };
				 this.setStartDate = function(v_startDate){
					 startDate = v_startDate;
				 };
				 this.getStartDate = function(){
					return startDate; 
				 };
				 this.setEndDate = function(v_endDate){
					 endDate = v_endDate;
				 };
				 this.getEndDate = function(){
					 return endDate;
				 };
				 this.setCurDate = function(v_curDate){
					 curDate = v_curDate;
				 };
				 this.getCurDate = function(){
					 return curDate;
				 }
				 //如果日期不存在,就默认为当前日期
				if(!strDate){
					var now = new Date();
					date = this.strToDate((now.getYear()+1900)+'-'+now.getMonth()+'-'+now.getDate());
				}else{
					date = this.strToDate(strDate); 
				} 
				//设置年月
				this.setYear( date.getYear() + 1900 );
				this.setMonth(date.getMonth());
			};
			
		})();
		Calendar.prototype = {    
		    strToDate : function(str) {     
		        var arys = str.split('-');    
		        var date = new Date(arys[0], arys[1], arys[2]);    
		        return date;    
		    },
		    isFourDigitYear : function(){
		    	
		    },
		    getDaysInMonth : function (year,month) {
		    	var days;
				if (month == 1 || month == 3 || month == 5 || month == 7 || month == 8 || month == 10 || month == 12)
					days = 31;
				else if (month == 4 || month == 6 || month == 9 || month == 11)
					days = 30;
				else if (month == 2) {
					if (this.isLeapYear(year)) {
						days = 29;
					} else {
						days = 28;
					}
				}
				return (days);
			},
		    isLeapYear: function (year) {
				if (((year % 4) == 0) && ((year % 100) != 0) || ((year % 400) == 0)) {
					return true;
				} else {
					return false;
				}
			},
			
			checkMinDate : function(year,month){
				// var minYear =  this.getResult().minYear + 1900;
				// var minMonth = this.getResult().minMonth;
				// if(year >= minYear && month >= minMonth ){
				// 	return true;
				// }
				return true;
			},
			setPreviousMonth : function () {
				var month = this.getMonth();
				var year = this.getYear();
				if (month == 0) {
					month = 11;
					//if (this.getYear() > 1000) {
					year--;
					//}
				} else {
					month--;
				}
				if(this.checkMinDate(year,month)){
					this.setYear( year);
					this.setMonth(month);
					this.displayCalendar();
				}
			},
			checkMaxDate : function(year,month){
				// var maxDate = this.strToDate(year+'-'+month+'-'+1);
				// var nextDate = this.strToDate(this.getDate().getFullYear()+'-'+(this.getDate().getMonth()+1*1)+'-'+1)
				// if(nextDate >= maxDate){
				// 	return true;
				// }
				return true;
			},
			setNextMonth : function () {
				var month = this.getMonth();
				var year = this.getYear();
				if (month == 11) {
					month = 0;
					year ++;
				} else {
					month++;
				}
				if(this.checkMaxDate(year,month)){
					this.setYear(year);
					this.setMonth(month);
					this.displayCalendar();
				}
			},
			
			createTd : function(className,text,wePoint){
				//var thisDate = (this.getDate().getYear()+ 1900*1)+'-'+this.getDate().getMonth()+'-'+this.getDate().getDate();
				//var thisDate = this.getYear()+'-'+this.getMonth()+'-'+text;
				console.log(this.getCurDate());
				var obj =  new DateConversion(this.getCurDate());
				console.log(obj.getResult());
				var nl =  obj.getRDay();
				if(nl == '初一'){
					nl =  obj.getRMonth();
				}
				return '<td class="'+className+'"><div  >'+text+'</div><div class="score">'+ nl +'</div></td>';
			},
			
			previousDays : function(){
				var month = this.getMonth();
				var year = this.getYear();
				if (month == 0) {
					month = 11;
					//if (year > 1000) {
						year--;
					//}
				} else {
					month--;
				}
				var days = this.getDaysInMonth(year, month+1);
				return {'year':year,'month':month,'days':days};
			},
			getWePoint : function(ymd,day){
				var wePoint = '';
				// var cdate =  this.strToDate( ymd.year+'-'+ymd.month+'-'+day);
				// //
				// if(this.getDate() < this.getStartDate() ){
				// 	wePoint = 0;//this.getWePointBySignInRule(cdate,day);
				// }else if(this.getEndDate() > this.getDate() && this.getDate() > this.getStartDate()) {
				// 	if(cdate <= this.getDate() ){
				// 		var das =  this.getResult().histories;
				// 		for(var i = 0 ; i < das.length;i++){
				// 			if(day == das[i].day 
				// 				&& ymd.year == das[i].year + 1900
				// 				&& ymd.month == das[i].month){
				// 				wePoint = das[i].wePoint;
				// 			}
				// 		}
				// 	}else{
				// 		wePoint = this.getWePointBySignInRule(cdate,day);
				// 	}
					
				// }else{
				// 	var das =  this.getResult().histories;
				// 	for(var i = 0 ; i < das.length;i++){
				// 		if(day == das[i].day 
				// 			&& ymd.year == das[i].year + 1900
				// 			&& ymd.month == das[i].month ){
				// 			wePoint = das[i].wePoint;
				// 		}
				// 	}
				// }
				return wePoint;
			},
			getWePointBySignInRule : function(cdate,day){
				//var cdate =  this.strToDate( ymd.year+'-'+ymd.month+'-'+day);
				var csr =  this.getResult().customerSignInRule;
				var  no = Math.abs(cdate.getTime() - this.getDate().getTime())/(24*60*60*1000);
				no  += csr.no;
				var signInRule = this.getResult().inRule;
				var signInRuleDetails =  signInRule.details;
				if(no > signInRuleDetails.length){
					return signInRuleDetails[signInRuleDetails.length-1].wePoint;
				}
				for(var i = 0 ;i < signInRuleDetails.length ; i++){
					if(signInRuleDetails[i].no == no){
						return signInRuleDetails[i].wePoint;
					}
				}
				throw new Error('没有找到相应的做签到规则!');
				
			},
			previousMonth : function(startingPos){
				var ymd = this.previousDays();
				var days = ymd.days;
				var tr ='<tr>';
				for (var i = 0; i < startingPos; i++) {
					var className='prevMonth';
					var wePoint = 0;//this.getWePoint(ymd,days-startingPos+i+1) ;
					var thisDate = this.strToDate((this.getDate().getYear()+ 1900*1)+'-'+this.getDate().getMonth()+'-'+this.getDate().getDate());
					var assignDate = this.strToDate(ymd.year+'-'+ymd.month+'-'+(days-startingPos+i+1*1) );
					if(wePoint && thisDate > assignDate  ){
						className ='dailyAttendance';
					}
					this.setCurDate(ymd.year+'-'+(ymd.month+1)+'-'+(days-startingPos+i+1*1));
					tr += this.createTd(className,days-startingPos+i+1,wePoint);
				}
				return tr;
			},
			thisMonth : function(startingPos,days){
				var tr ='';
				for (var i = startingPos; i < days; i++) {
					if (i % 7 == 0) {
						tr += "</tr><tr>"
					}
					var className = '';
					if(this.getDate().getDate() == i - startingPos + 1 
							&& this.getDate().getMonth() == this.getMonth() 
							&& this.getDate().getYear()+ 1900 == this.getYear() ){
						className = 'thisDay';
					}
					var displayDay = '';
					if(i == startingPos){
						displayDay = (this.getMonth()+1)+"月";
					}else{
						displayDay = i - startingPos + 1;
					}
					var wePoint =0;//= this.getWePoint({'year':this.getYear(),'month':this.getMonth()},i-startingPos+1) ;
					var thisDate = this.strToDate((this.getDate().getYear()+ 1900*1)+'-'+this.getDate().getMonth()+'-'+this.getDate().getDate());
					var assignDate = this.strToDate(this.getYear()+'-'+this.getMonth()+'-'+(i - startingPos + 1*1) );
					if(wePoint && thisDate > assignDate ){
						className ='dailyAttendance';
					}
					this.setCurDate(this.getYear()+'-'+(this.getMonth()+1)+'-'+(i - startingPos + 1*1));
					tr += this.createTd(className,displayDay,wePoint);
				}
				return tr;
			},
			nextDays : function(){
				var month = this.getMonth();
				var year  = this.getYear();
				if (month == 11) {
					month = 0;
					year ++;
				} else {
					month++;
				}
				var days = this.getDaysInMonth(year, month+1);
				return {'year':year,'month':month,'days':days};
			},
			endDays : function(days){
				var endDay = 28;
				if(days > 35){
					endDay =42;
				}else if(days > 28 ){
					endDay = 35;
				}
				return endDay;
			},
			nextMonth : function(startingPos,days){
				var tr = '';
				var nextDay = 1;
				var ymd = this.nextDays();
				var displayDay = (ymd.month+1)+"月"
				var endDay = this.endDays(days);
				for (i = days; i < endDay; i++) {
					var className ='nextMonth';
					var wePoint = this.getWePoint(ymd,nextDay) ;
					var thisDate = this.strToDate((this.getDate().getYear()+ 1900*1)+'-'+this.getDate().getMonth()+'-'+this.getDate().getDate());
					var assignDate = this.strToDate(ymd.year+'-'+ymd.month+'-'+ nextDay );
					if(wePoint && thisDate > assignDate  ){
						className ='dailyAttendance';
					}
					this.setCurDate(ymd.year+'-'+(ymd.month+1)+'-'+nextDay);
					tr += this.createTd(className,displayDay,wePoint);
					displayDay = ++nextDay;
				}
				return tr+= "</tr>";
			},
			displayCalendar : function () {
				
				var days = this.getDaysInMonth(this.getYear(), this.getMonth()+1);
				var firstOfMonth = new Date(this.getYear(), this.getMonth(), 1);
				var startingPos = firstOfMonth.getDay();
				days += startingPos;
				
				var preDays = this.previousDays();
				var day = preDays.days-startingPos+1
				var startDateStr = preDays.year+'-'+(preDays.month +1)+'-'+day;
				
				var nextDays = this.nextDays();
				var endDay = this.endDays(days) - days ;
				var endDateStr = nextDays.year+'-'+(nextDays.month +1)+'-'+endDay;
				
				
				
				var url = '${rc.contextPath}/dailyAttendanceWechat/getDailyAttendance';
				var param = { 'startDate' : startDateStr, 'endDate' : endDateStr }
				var startDate = this.strToDate(preDays.year+'-'+preDays.month +'-'+day);
				var endDate = this.strToDate(nextDays.year+ '-' +nextDays.month +'-'+endDay);
				this.setStartDate(startDate);
				this.setEndDate(endDate);
				$('#crtDate').html(this.getYear()+'年'+(this.getMonth()+1*1)+'月');
				var tr = this.previousMonth(startingPos)+this.thisMonth(startingPos,days)+this.nextMonth(startingPos,days);
					var tb = $('table > tbody ');
					tb.children().remove();
					tb.append(tr);
				if(this.getDate() < startDate ){
					var tr = this.previousMonth(startingPos)+this.thisMonth(startingPos,days)+this.nextMonth(startingPos,days);
					var tb = $('table > tbody ');
					tb.children().remove();
					tb.append(tr);
				}else{
					var that = this;
					var tr = that.previousMonth(startingPos)+that.thisMonth(startingPos,days)+that.nextMonth(startingPos,days);
						var tb = $('table > tbody ');
						tb.children().remove();
						tb.append(tr);
					// base.postNoAlert( url,param, function(result) {
					// 	that.setResult(result);						
					// 	$('#countWePoint').html('签到共计:<span style="color:#F96B57;">'+result.totalWePoint+'分</span>');
					// 	$('#daCount').html('连续签到:<span style="color:#F96B57;">'+result.customerSignInRule.no+'天</span>');
					// 	var tr = that.previousMonth(startingPos)+that.thisMonth(startingPos,days)+that.nextMonth(startingPos,days);
					// 	var tb = $('table > tbody ');
					// 	tb.children().remove();
					// 	tb.append(tr);
					// 	$('#signInRuleDetail').html('<b>签到规则如下:</b><br/>'+result.inRule.declaration);
					// });
				}
			} 
		};
		var calendar = new Calendar();
		calendar.displayCalendar();
		
		$('#preMonth').click(function(){
			calendar.setPreviousMonth();
		});
		$('#nextMonth').click(function(){
			calendar.setNextMonth();
		});
	});
	
</SCRIPT>
</head>
<body>
	<div class="row" style="margin: 0px;">
		<div id="daCount" class="col-xs-4" style="padding: 0px;"></div>
		<div id="crtDate" class="col-xs-4" style="padding: 0px;text-align: center;"></div>
		<div id="countWePoint" class="col-xs-4" style="padding: 0px;text-align: right;"></div>
	</div>
	<div style="clear: both;">
		<b class="rtop"><b class="r1"></b><b class="r2"></b> <b class="r3"></b><b class="r4"></b></b>
		<table class="table table-bordered">
			<thead>
				<tr>
					<th>日</th>
					<th>一</th>
					<th>二</th>
					<th>三</th>
					<th>四</th>
					<th>五</th>
					<th>六</th>
				</tr>
			</thead>
			<tbody>
				<tr>
					<td></td>
					<td></td>
					<td></td>
					<td></td>
					<td></td>
					<td></td>
					<td></td>
				</tr>
			</tbody>
		</table>
		<b class="rbottom"><b class="r4"></b><b class="r3"></b> <b class="r2"></b><b class="r1"></b></b>
	</div>
	<a href="javascript:void(0)" id="preMonth">前一个月</a>
	<a href="javascript:void(0)" id="nextMonth">后一个月</a>
</body>
</html>

  • 大小: 13.4 KB
分享到:
评论

相关推荐

    日历控件大全 - 日历控件

    在IT领域,日历控件是一种常见的用户界面元素,它允许用户方便地选择日期或查看日期安排。在本文中,我们将深入探讨日历控件的种类、用途、设计原则以及如何在不同编程语言和框架中实现和应用这些控件。 首先,让...

    Qt 自定义 Calendar 日历控件

    在本场景中,我们关注的是“Qt自定义Calendar日历控件”。这涉及到使用Qt库中的QCalendarWidget或者完全从头构建一个自定义的日历组件。通过自定义,我们可以更好地控制日历的显示、交互和样式,以适应应用程序的...

    提供excel 日历控件9.0下载(工具必须的插件)

    在Excel中,日历控件是一种非常实用的功能,它允许用户通过一个直观的日历界面来选择日期,这对于处理与时间相关的数据尤其有用。标题提到的"提供excel 日历控件9.0下载"指的是为不支持或缺少此功能的Excel版本提供...

    html js脚本日历控件

    在JavaScript中,创建一个日历控件主要涉及到DOM操作、事件处理和一些基本的CSS样式设计。下面我们将详细探讨这些知识点: 1. **DOM操作**:HTML文档对象模型(DOM)是HTML和XML文档的编程接口。在JavaScript中,...

    Winform自定义日历控件

    当我们需要在Winform应用中实现特定的日历功能,如考勤管理、日程安排或任务计划时,自定义日历控件就显得尤为重要。本文将详细讨论如何创建一个Winform自定义日历控件,并探讨其在实际业务中的应用。 首先,创建...

    MFC日历控件的使用方法

    在Microsoft Foundation Classes (MFC)库中,日历控件是一种用于显示和选择日期的图形用户界面元素。本文将深入探讨如何在MFC应用程序中添加并使用日历控件,以便用户可以方便地进行日期选择。 首先,我们需要在...

    VC MFC日历控件ocx activex

    "VC MFC日历控件OCX ActiveX"是Microsoft Visual C++(简称VC)MFC(Microsoft Foundation Classes)框架下的一种控件,用于创建具有日历功能的应用程序。这种控件基于ActiveX技术,也称为OCX(OLE Control ...

    组态王应用——日历控件的使用

    ### 组态王应用——日历控件的深入解析与实践 #### 一、日历控件概述 在工业自动化领域,组态软件是实现监控与数据采集(SCADA)的关键工具之一。其中,“组态王”作为一款知名的国产组态软件,广泛应用于各种工业...

    日历控件大集合—各式各样的日历控件

    在IT领域,日历控件是用户界面设计中不可或缺的一部分,尤其在涉及到日期选择、日程安排或时间管理的应用中。日历控件提供了一种直观且用户友好的方式来与日期进行交互。本篇文章将深入探讨日历控件的各种类型、设计...

    网页表单中的日历控件

    在网页表单中,日历控件是一个非常实用的功能,它为用户提供了一个直观的方式来选择日期,避免了手动输入可能产生的错误。日历控件通常会显示一个交互式的月份视图,用户可以通过点击来选择特定的日期。这种控件在...

    winform自定义日历控件

    本案例中,我们讨论的是如何创建一个"winform自定义日历控件",模仿百度的日历展示样式。这个自定义控件通常会包含日期选择、事件标记、颜色定制等功能,以提供更加友好和个性化的用户体验。 在C#中,我们可以继承`...

    一套完整的日历控件

    在IT领域,日历控件是一种常见的用户界面元素,它允许用户方便地选择日期和时间。这个名为"一套完整的日历控件"的资源提供了一个源码开放的日历控件解决方案,适合开发者在构建Web应用时集成到他们的项目中。这个...

    日历控件.rar 日历控件.rar

    日历控件是软件开发中常见的一种用户界面元素,它允许用户方便地选择日期或进行日期相关的操作。在本文中,我们将深入探讨日历控件的设计、实现、用途以及与之相关的技术细节。 首先,日历控件通常分为两种类型:...

    JQ版本自定义日历控件

    在网页开发中,日历控件是一个常见且实用的组件,它可以帮助用户方便地选择日期,常见于表单输入、事件预订或者时间管理等场景。"JQ版本自定义日历控件"是指利用jQuery来实现一个可自定义的日历插件。接下来,我们将...

    强大的日历控件

    【强大的日历控件】是一种在软件开发中广泛使用的组件,尤其在Web应用程序和桌面应用程序中,它为用户提供了一个直观的界面来选择日期或者进行日期相关的操作。在信息技术领域,日历控件是用户界面(UI)设计的一个...

    介绍一个ActiveX日历控件.ocx

    "ActiveX日历控件.ocx"就是这样一个专门用于显示日期和时间的组件。 日历控件是用户界面设计中的常见元素,它允许用户方便地选择日期,常用于事件预订、任务管理或任何形式的日期输入。在ActiveX框架下,这个`.ocx`...

    JSP日历控件代码

    **JSP日历控件代码详解** 在网页开发中,日期选择控件是常见的功能之一,JSP(JavaServer Pages)作为服务器端脚本语言,提供了丰富的功能来创建动态网页。本篇将深入探讨如何在JSP中实现日历控件,并基于提供的...

    ASP.net调用日历控件

    在ASP.NET中,日历控件(Calendar Control)是一个非常常用的UI组件,它允许用户以图形化的方式选择日期。在本教程中,我们将探讨如何在ASP.NET应用中调用日历控件,并将所选日期赋值给一个文本框。 首先,让我们...

    日历控件12

    在IT领域,日历控件是一种常见的用户界面元素,它允许用户方便地选择日期或进行日期相关的操作。在“日历控件12”中,我们可能会遇到一系列关于如何集成、自定义以及优化这种控件的知识点。下面将详细介绍这些内容。...

    6个JS日历控件个JS日历控件

    JavaScript(JS)日历控件是网页开发中常用的一种组件,用于展示日期选择功能,通常在表单中作为输入辅助工具出现。它们可以提供用户友好的界面,方便用户选择日期,而无需手动输入。以下是对JS日历控件的一些详细...

Global site tag (gtag.js) - Google Analytics