jQueryで書かれたカレンダー（カレンダースタイルと関数を含む）

复制代代码如下:
普通の用:
按钮调用:id="button" type= "button" onclick="c.showMoreDay = true; c.show(getObjById('btntxt'), '1982-1-1', this)" />

id="button3" type="button" onclick="c.showMoreDay = true; c.show(this, getObjById('btntxt3'))" />
必要な jQuery 文件
复制代代码如下:
function Calendar(objName) 
{ 
this.style = { 
borderColor : "#909eff", //边框颜色 
headerBackColor : "#909EFF", //表头背景颜色 
headerFontColor : "#ffffff", //表头字体颜色 
bodyBarBackColor : "#f4f4f4", //日历标题背景色 
bodyBarFontColor : "#000000", //日历标题字体色 
bodyBackColor : "#ffffff", //日历背景色 
bodyFontColor : "#000000", //日历字体色 
bodyHolidayFontColor : "#ff0000", //假日字体色 
watermarkColor : "#d4d4d4", //背景水印色 
moreDayColor : "#cccccc" 
}; 
this.showMoreDay = false; //是否显示上月和下月的日期 
this.Obj = objName; 
this.date = null; 
this.mouseOffset = null; 
this.dateInput = null; 
this.timer = null; 
}; 
Calendar.prototype.toString = function() 
{ 
var str = this.getStyle(); 
str += '\n'; 
str += '
'; 
str += this.getHeader(); 
str += this.getBody(); 
str += '
'; 
文字列を返します。 
}; 
Calendar.prototype.getStyle = function() 
{ 
var str = 'n'; 
文字列を返します。 
}; 
Calendar.prototype.getHeader = function() 
{ 
var str = '< tr 著者="alin" align="center">n'; 
str = 'n'; 
str = 'n'; 
str = 'n'; 
str = 'n'; 
str = 'n'; 
str = 'n'; 
str = '<<<00>>>
n'; 
文字列を返します。 
}; 
Calendar.prototype.getBody = function() 
{ 
var n = 0; 
var str = this.getBodyBar(); 
str = 'n'; 
for(i = 0; i <6; i ) 
{ 
str = ''; 
for(j = 0; j { 
str = 'n'; 
} 
str = ''; 
} 
str = '
n'; 
str = '文字列を返します。 
}; 
Calendar.prototype.getBodyBar = function() 
{ 
var str = '今天：' new Date().toFormatString("yyyy年mm月dd日") '
n'; 
var day = new Array('日','一','二','三','四','五','六'); 
for(i = 0; i { 
str = 'n'; 
} 
str = ''   day[i] '
'; 
文字列を返します。 
}
Calendar.prototype.get YearMenu = function(year) 
{ 
var str = 'n '; 
for(i = 0; i <10; i ) 
{ 
var _year = year i; 
var _date = new Date(_year,this.date.getMonth(),this.date.getDate()); 
str = 'n'; 
str = ''; 
} 
str = 'n'; 
str = 'if(this.date.getFullyear() != _year) 
{ 
str = 'onmouseover="this.className='menuOver'" onmouseout="this.className=''" '; 
} 
else 
{ 
str = 'class="menuOver"'; 
} 
str = 'onclick="' this.Obj '.bindDate('' _date.toFormatString("-") '')">'   _year '年
n'; 
str = 'n'; 
str = 'n'; 
str = '<<>>
'; 
var _menu = getObjById("cdrMenu"); 
_menu.innerHTML = str; 
}; 
Calendar.prototype.getMonthMenu = function() 
{ 
var str = 'n' ; 
for(i = 1; i { 
var _date = new Date(this.date.getFull Year(),i-1,this.date.getDate()) ; 
str = 'n'; 
} 
str = 'if(this.date.getMonth() 1 != i) 
{ 
str = 'onmouseover="this.className='menuOver'" onmouseout="this.className=''" '; 
} 
else 
{ 
str = 'class="menuOver"'; 
} 
str = 'onclick="' this.Obj '.bindDate('' _date.toFormatString("-") '')">' i '月
'; 
var _menu = getObjById("cdrMenu"); 
_menu.innerHTML = str; 
}; 
Calendar.prototype.show = function() 
{ 
if (arguments.length > 3 || argument.length == 0) 
{ 
alert("对不起！传入パラメータ不对！" ); 
return; 
} 
var _date = null; 
var _evObj = null; 
var _initValue = null 
for(i = 0; i < argument.length ; i ) 
{ 
if(typeof(arguments[i]) == "オブジェクト" && argument[i].type == "テキスト") 
{_date = argument[i];} 
else if(typeof(arguments[i]) == "オブジェクト") 
{_evObj = argument[i];} 
else if(typeof(arguments[i]) == "文字列") 
{_initValue = argument[i];} 
} 
_evObj = _evObj || _date; 
targetObj = _evObj 
if(!_date)传入パラメータ错误!"); return;} 
this.dateInput = _date; 
_date = _date.value; 
if(_date == "" && _initValue) _date = _initValue; 
this .bindDate(_date); 
var _target = getPosition(_evObj); 
_obj.style.display = ""; = _target.x 'px'; 
if((document.body.clientHeight - (_target.y _evObj.clientHeight)) >= _obj.clientHeight) 
{ 
_obj.style.top = ( _target.y _evObj.clientHeight) 'px'; 
} 
else 
{ 
_obj.style.top = (_target.y - _obj.clientHeight) 'px'; 
} 
}; 
Calendar.prototype.hide = function() 
{ 
var obj = getObjById("Calendar"); 
obj.style.display = "なし"; 
}; 
Calendar.prototype.bindDate = function(date) 
{ 
var _monthDays = new Array(31,30,31,30,31,30,31,31,30,31,30,31) ; 
var _arr = date.split('-'); 
var _date = 新しい日付(_arr[0],_arr[1]-1,_arr[2]); 
if(isNaN(_date)) _date = 新しい日付(); 
this.date = _date; 
this.bindHeader(); 
var _year = _date.getFullyear(); 
var _month = _date.getMonth(); 
var _day = 1; 
var _startDay = 新しい日付(_年,_月,1).getDay(); 
var _previyear = _month == 0 ? _年 - 1 : _年; 
var _previMonth = _month == 0 ? 11 : _月 - 1; 
var _previDay = _monthDays[_previMonth]; 
if (_previMonth == 1) _previDay =((_previ Year%4==0)&&(_previ Year0!=0)||(_previ Year@0==0))?29:28; 
_previDay -= _startDay - 1; 
var _nextDay = 1; 
_monthDays[1] = ((_year%4==0)&&(_year0!=0)||(_year@0==0))?29:28; 
for(i = 0; i { 
var _dayElement = getObjById("cdrDay" i); 
_dayElement.onmouseover = Function(this.Obj ".onMouseOver(this)"); 
_dayElement.onmouseout = Function(this.Obj ".onMouseOut(this)"); 
_dayElement.onclick = Function(this.Obj ".onClick(this)"); 
this.onMouseOut(_dayElement); 
_dayElement.style.color = ""; 
if(i < _startDay) 
{ 
//获取上一月の日期 
if(this.showMoreDay) 
{ 
var _previDate = new Date(_year,_month) - 1,_previDay); 
_dayElement.innerHTML = _previDay; 
_dayElement.title = _previDate.toFormatString("yyyy年mm月dd日"); 
_dayElement.value = _previDate.toFormatString("-"); 
_dayElement.style.color = this.style.moreDayColor; 
_previDay ; 
}else 
{ 
_dayElement.innerHTML = ""; 
_dayElement.title = ""; 
} 
} 
else if(_day > _monthDays[_month]) 
{ 
//获取下个月的日期 
if(this.showMoreDay) 
{ 
var _nextDate = 新しい日付(_年,_月 1,_nextDay); 
_dayElement.innerHTML = _nextDay; 
_dayElement.title = _nextDate.toFormatString("yyyy年mm月dd日"); 
_dayElement.value = _nextDate.toFormatString("-"); 
_dayElement.style.color = this.style.moreDayColor; 
_nextDay ; 
}else 
{ 
_dayElement.innerHTML = ""; 
_dayElement.title = ""; 
} 
} 
else if(i >= new Date(_year,_month,1).getDay() && _day <= _monthDays[_month]) 
{ 
//获取本月日期 
_dayElement.innerHTML = _day; 
if(_day == _date.getDate()) 
{ 
this.onMouseOver(_dayElement); 
_dayElement.onmouseover = Function(""); 
_dayElement.onmouseout = Function(""); 
} 
if(this.isHoliday(_年,_月,_日)) 
{ 
_dayElement.style.color = this.style.bodyHolidayFontColor; 
} 
var _curDate = 新しい日付(_年、_月、_日); 
_dayElement.title = _curDate.toFormatString("yyyy年mm月dd日"); 
_dayElement.value = _curDate.toFormatString("-"); 
_日 ; 
} 
else 
{ 
_dayElement.innerHTML = ""; 
_dayElement.title = ""; 
} 
} 
var _menu = getObjById("cdrMenu"); 
_menu.style.display = "なし"; 
}; 
Calendar.prototype.bindHeader = function() 
{ 
var _curyear = getObjById("currentyear"); 
var _curMonth = getObjById("currentMonth"); 
var _watermark = getObjById("cdrWatermark"); 
_curyear.innerHTML = this.date.toFormatString("yyyy年"); 
_curMonth.innerHTML = this.date.toFormatString("mm月"); 
_watermark.innerHTML = this.date.getFull Year(); 
}; 
Calendar.prototype.getToday = function() 
{ 
var _date = new Date(); 
this.bindDate(_date.toFormatString("-")); 
}; 
Calendar.prototype.isHoliday = function(年,月,日付) 
{ 
var _date = new Date(年,月,日付); 
return (_date.getDay() == 6 || _date.getDay() == 0); 
}; 
Calendar.prototype.onMouseOver = function(obj) 
{ 
obj.className = "dayOver"; 
}; 
Calendar.prototype.onMouseOut = function(obj) 
{ 
obj.className = "dayOut"; 
}; 
Calendar.prototype.onClick = function(obj) 
{ 
if(obj.innerHTML != "") this.dateInput.value = obj.value; 
this.hide(); 
}; 
Calendar.prototype.onChange Year = function(isnext) 
{ 
var _year = this.date.getFull Year(); 
var _month = this.date.getMonth() 1; 
var _date = this.date.getDate(); 
if(_year > 999 && _year <10000) 
{ 
if(isnext){_year ;}else{ _year --;} 
} 
else 
{ 
alert("年份超出范围（1000-9999）!"); 
} 
this.bindDate(_year '-' _month '-' _date); 
}; 
Calendar.prototype.onChangeMonth = function(isnext) 
{ 
var _year = this.date.getFull Year(); 
var _month = this.date.getMonth() 1; 
var _date = this.date.getDate(); 
if(isnext){ _month ;} else {_month--;} 
if(_year > 999 && _year <10000) 
{ 
if(_month < 1) {_month = 12; _year--;} 
if(_month > 12) {_month = 1; _year ;} 
} 
else 
{ 
alert("年份超出范围（1000-9999）!"); 
} 
this.bindDate(_年 '-' _月 '-' _date); 
}; 
Calendar.prototype.showMenu = function(isyear) 
{ 
var _menu = getObjById("cdrMenu"); 
if(isyear != null) 
{ 
var _obj = (isyear)? getObjById("current Year") : getObjById("currentMonth"); 
if(isyear) 
{ 
this.get YearMenu(this.date.getFull Year() - 5); 
} 
else 
{ 
this.getMonthMenu(); 
} 
_menu.style.top = (_obj.offsetTop _obj.offsetHeight) 'px'; 
_menu.style.left = _obj.offsetLeft 'px'; 
_menu.style.width = _obj.offsetWidth 'px'; 
} 
if (this.timer != null) clearTimeout(this.timer); 
_menu.style.display=""; 
} 
Calendar.prototype.hideMenu = function() 
{ 
var _obj = getObjById("cdrMenu"); 
this.timer = window.setTimeout(function(){_obj.style.display='none';},500); 
} 
Number.prototype.NaN0 = function() 
{ 
return isNaN(this) ? 0 : これ; 
} 
Date.prototype.toFormatString = function(fs) 
{ 
if(fs.length == 1) 
{ 
return this.getFull Year() fs (this. getMonth() 1) fs this.getDate(); 
} 
fs = fs.replace("yyyy",this.getFull Year()); 
fs = fs.replace("mm",(this.getMonth() 1)); 
fs = fs.replace("dd",this.getDate()); 
fs を返す; 
} 
var inputObj = null; 
var targetObj = null; 
varragObj = null; 
varmouseOffset = null; 
function getObjById(obj) 
{ 
if(document.getElementByIdx_x) 
{ 
return document.getElementByIdx_x(obj); 
} 
else 
{ 
alert("浏览器不支持!"); 
} 
} 
関数 MouseCoords(ev) 
{ 
if(ev.pageX || ev.pageY){ 
return {x:ev.pageX, y:ev.ページY}; 
} 
return { 
x:ev.clientX document.body.scrollLeft - document.body.clientLeft, 
y:ev.clientY document.body.scrollTop - document.body.clientTop 
}; 
} 
関数 getPosition(e) 
{ 
var left = 0; 
var トップ = 0; 
while (e.offsetParent){ 
left = e.offsetLeft (e.currentStyle?(parseInt(e.currentStyle.borderLeftWidth)).NaN0():0); 
top = e.offsetTop (e.currentStyle?(parseInt(e.currentStyle.borderTopWidth)).NaN0():0); 
e = e.offsetParent; 
} 
left = e.offsetLeft (e.currentStyle?(parseInt(e.currentStyle.borderLeftWidth)).NaN0():0); 
top = e.offsetTop (e.currentStyle?(parseInt(e.currentStyle.borderTopWidth)).NaN0():0); 
return {x:left, y:top}; 
} 
関数 getMouseOffset(target, ev) 
{ 
ev = ev ||ウィンドウ.イベント; 
var docPos = getPosition(target); 
var MousePos = MouseCoords(ev); 
return {x:mousePos.x - docPos.x, y:mousePos.y - docPos.y}; 
} 
関数 closeCalendar(evt){ 
evt = evt ||ウィンドウ.イベント; 
var _target= evt.target || evt.src要素; 
if(!_target.getAttribute("作成者") && _target != inputObj && _target != targetObj) 
{ 
getObjById("カレンダー").style.display = "none"; 
} 
} 
functionragStart(evt){ 
evt = evt ||ウィンドウ.イベント; 
var _target= evt.target || evt.src要素; 
if(_target.getAttribute("著者") == "alin_bar") 
{ 
dragObj = getObjById("カレンダー"); 
mouseOffset = getMouseOffset(dragObj, evt); 
} 
} 
関数ドラッグ(evt) 
{ 
evt = evt ||ウィンドウ.イベント; 
if(dragObj) 
{ 
var MousePos = MouseCoords(evt); 
dragObj.style.left = (mousePos.x - MouseOffset.x) 'px'; 
dragObj.style.top = (mousePos.y - MouseOffset.y) 'px'; 
} 
} 
//拖アニメーション结束 
functionragEnd(evt) 
{ 
dragObj = null; 
} 
document.onclick = closeCalendar; 
document.onmousedown = ドラッグスタート; 
document.onmousemove = ドラッグ; 
document.onmouseup = ドラッグエンド; 
jQueryで書かれたカレンダー（カレンダースタイルと関数を含む）_jquery
