日期:2014-05-16  浏览次数:20608 次

JS日历选择插件二

JS代码
var Calendar = function( instanceId, language, startYear, endYear ){
	if( typeof instanceId == "string" ){
		this.Date  	= new Date();
		this.Year  	= this.Date.getFullYear();
		this.Month 	= this.Date.getMonth();
		this.Week	= this.Date.getDay();
		this.Today	= this.Date.getDate();
		
		this.InstanceId = instanceId;
		this.Language	= language 	|| 1;
		this.StartYear	= startYear || this.Year - 20;
		this.EndYear	= endYear 	|| this.Year + 1;
		
		// If instance is input[type='text'] object
		this.popContainer_id =  'popCalendarContainer';
		
		// Message store
		this.msgStore = [];
		
		this.caleContainer_id = 'calendarContainer';
		this.caleTop = {
			today_view_id:		'calendarTodayView',
			week_view_id:		'calendarWeekView',
			lq_year_id:			'linkQuickYear',
			lq_month_id:		'linkQuickMonth',
			sq_year_id:			'selectQuickYear',
			sq_month_id:		'selectQuickMonth',
			close_id:			'calendarClose',
			prev_month_id:		'toPrevMonth',
			back_today_id:		'backToday',
			next_month_id:		'toNextMonth'
		}
		this.daysContainer_id = 'calendarDaysContainer';
		this.msgContainer_id = 'calendarTipsContainer';
		
		this.curDayClass = 		'calendarCurrentDay';
		this.tipDayClass =		'calendarTipDay';
		this.oldTipDayClass =	'calendarOldTipDay';
	}
};
/* Calendar language */
Calendar.lang = {
  weeks:  	[
  				["星期天", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"],
  				["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"]
  			],        
  weeksMenu:[
	 			["日","一","二","三","四","五","六"],
	       		["SUN","MON","TUR","WED","THU","FRI","SAT"]
          	]
};
/* Create calendar element */
Calendar.prototype._getViewElement = function(){
	// Create page html element
	var caleElem = "";
		// Create Start
		caleElem+= '<div id='+this.caleContainer_id+'>';
		
		// <Top>
		caleElem+= '<div id="calendarTopContainer"><table cellpadding="0" cellspacing="0"><tr>';
		
		// Top day view
		caleElem+= '<td id='+this.caleTop.today_view_id+'></td>';
		
		// Link or select control
		caleElem+= '<td>';
		caleElem+= '<div id='+this.caleTop.week_view_id+'></div>';
		caleElem+= '<table id="calendarYearMonthContainer" cellpadding="0" cellspacing="0">';
		caleElem+= '<tr>';
		caleElem+= '<td>';
		caleElem+= '<a id='+this.caleTop.lq_year_id+' href="javascript:void(0);"></a>';
		caleElem+= '<select id='+this.caleTop.sq_year_id+'></select>';
		caleElem+= '</td>';
		caleElem+= '<td>.</td>';
		caleElem+= '<td>';
		caleElem+= '<a id='+this.caleTop.lq_month_id+' href="javascript:void(0);"></a>';
		caleElem+= '<select id='+this.caleTop.sq_month_id+'></select>';
		caleElem+= '</td>';
		caleElem+= '</tr>';
		caleElem+= '</table>';
		caleElem+= '</td>';
		
		// Quick control
		caleElem+= '<td>';
		caleElem+= '<div id="calendarCloseContainer">';
		caleElem+= '<a id='+this.caleTop.close_id+' href="javascript:void(0);">x</a>';
		caleElem+= '</div>';
		
		caleElem+= '<div id="calendarQuickContainer">';
		caleElem+= '<a id='+this.caleTop.prev_month_id+' href="javascript:void(0);">&laquo;</a>';
		caleElem+= '<a id='+this.caleTop.back_today_id+' href="javascript:void(0);">&nbsp;</a>';
		caleElem+= '<a id='+this.caleTop.next_month_id+' href="javascript:void(0);">&raquo;</a>';
		caleElem+= '</div>';
		caleElem+= '</td>';
		
		caleElem+= '</tr></table cellpadding="0" cellspacing="0"></div>';
		// </Top>
		
		// <Calendar View>
		caleElem+= '<div id="calendarMainContainer">';
		// Week menu
		caleElem+= '<div id="calendarWeeksContainer">';
		for(var i = 0; i < 7; i ++){
		caleElem+= '<span>'+Calendar.lang["weeksMenu"][this.Language][i]+'</span>';
		}
		caleElem+= '&