摘要：无标题文档/****************************************************************...
无标题文档 /******************************************************************************************* * 创建对象 var c = new Calendar("c"); document.write(c); * 调用方法 c.show(arg1,arg2,arg3) * 参数1: 文本输入框(必填). 如 onfocus="c.show(this)"; * 参数2: 按钮或其它可用单击事件的HTML元素(如果使用按钮方式则必填). 如 *=文本输入框名称 * 参数3: 如果没有文本框没有值则使用该值初始化日历(选填). 如 onfocus="c.show(this,'2006-01-01') * 注: 参数顺序不分先后. MSIE6/Opera8/FireFox1.5 下测试通过 ************************如果您使用本日历控件 请保留该信息 谢谢! *************************** * http://2lin.net * Email:caoailin@gmail.com * QQ:38062022 * Creation date: 2006-10-29 *********************************************************************************************/ function Calendar(objName) { this.style = { borderColor : "#909eff", //边框颜色 headerBackColor : "#909EFF", //表头背景颜色 headerFontColor : "#ffffff", //表头字体颜色 bodyBarBackColor : "#f4f4f4", //日历标题背景色 bodyBarFontColor : "#000000", //日历标题字体色 bodyBackColor : "#ffffff", //日历背景色 bodyFontColor : "#000000", //日历字体色 bodyHolidayFontColor : "#ff0000", //假日字体色 watermarkColor : "#d4d4d4" //背景水印色 }; this.Obj = objName; this.date = null; this.mouseOffset = null; this.dateInput = null; this.timer = null; this.drag = false; }; Calendar.prototype.toString = function() { var str = this.getStyle(); str += 'n'; str += ''; str += this.getHeader(); str += this.getBody(); str += ''; return str; }; Calendar.prototype.getStyle = function() { var str = 'n'; str += '.calendar{position:absolute;width:142px;height:174px;background-color:'+this.style.bodyBackColor+';border:1px solid ' + this.style.borderColor + ';left:0px;top:0px;z-index:9999;}n'; str += '.cdrHeader{background-color:'+ this.style.headerBackColor +';width:140px;height:22px;font-size:12px;color:'+this.style.headerFontColor+';}n'; str += '.cdrWatermark{position:absolute;left:0px;top:55px;width:140px;font-family: Arial Black;font-size:50px;color:'+this.style.watermarkColor+';z-index:1;text-align:center;}n'; str += '.cdrBodyBar{background-color:' + this.style.bodyBarBackColor + ';font-size:12px;color:' + this.style.bodyBarFontColor + ';width:140px;height:20px;}n'; str += '.cdrBody{width:140px;font-size:12px;cursor:pointer;color:' + this.style.bodyFontColor + ';}n'; str += '.dayOver{border:1px solid black;background-color:#f4f4f4;}n'; str += '.menuOver{background-color:'+this.style.headerBackColor+';color:'+this.style.headerFontColor+';font-size:12px;}n'; str += '.headerOver{border:1px solid black;background-color:#f4f4f4;color:black;cursor:default;}n'; str += '.cdrMenu{font-size:12px;border:1px solid #000000;background-color:#ffffff;cursor:default;width:100%}n'; str += 'n'; return str; }; Calendar.prototype.getHeader = function() { var str = '
n'; return str; }; Calendar.prototype.getBody = function() { var n = 0; var str = '
n'; str += '
n';
for(i = 0; i < 6; i++)
{
str += '';
for(j = 0; j < 7; j++)
{
str += ' | n';
}
str += '
';
}
str += '
n'; str += '
n'; return str; }; Calendar.prototype.getYearMenu = function(year) { var str = ''; var _menu = this.getObjById("cdrMenu"); _menu.innerHTML = str; }; Calendar.prototype.getMonthMenu = function() { var str = '
n'; for(i = 1; i 3 || arguments.length == 0) { alert("对不起！传入参数不对！" ); return; } var _date = null; var _evObj = null; var _initValue = null for(i = 0; i < arguments.length; i++) { if(typeof(arguments[i]) == "object" && arguments[i].type == "text") {_date = arguments[i];} else if(typeof(arguments[i]) == "object") {_evObj = arguments[i];} else if(typeof(arguments[i]) == "string") {_initValue = arguments[i];} } _evObj = _evObj || _date; if(!_date){alert("传入参数错误!"); return;} this.dateInput = _date; _date = _date.value; if(_date == "" && _initValue) _date = _initValue; this.bindDate(_date); var _target = this.getPosition(_evObj); var _obj = this.getObjById("Calendar"); _obj.style.display = ""; _obj.style.left = _target.x; if((document.body.clientHeight - (_target.y + _evObj.clientHeight)) >= _obj.clientHeight) { _obj.style.top = _target.y + _evObj.clientHeight; } else { _obj.style.top = _target.y - _obj.clientHeight; } }; Calendar.prototype.hide = function() { var obj = this.getObjById("Calendar"); obj.style.display = "none"; }; Calendar.prototype.bindDate = function(date) { var _monthDays = new Array(31,30,31,30,31,30,31,31,30,31,30,31); var _day = 1; var _arr = date.split('-'); var _date = new Date(_arr[0],_arr[1]-1,_arr[2]); if(isNaN(_date)) _date = new Date(); this.date = _date; this.bindHeader(); var _year = _date.getFullYear(); var _month = _date.getMonth(); _monthDays[1] = ((_year%4==0)&&(_year%100!=0)||(_year%400==0))?29:28; for(i = 0; i < 42; i++) { var _dayElement = this.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); if(i >= new Date(_year,_month,1).getDay() && _day 999 && _year 999 && _year 12) {_month = 1; _year++;} } else { alert("年份超出范围（1000-9999）!"); } this.bindDate(_year + '-' + _month + '-' + _date); }; Calendar.prototype.onMouseMove = function (evt) { evt = evt || window.event; if(this.drag && evt.button == 1) { var obj = this.getObjById("Calendar"); var mousePos = this.mouseCoords(evt); obj.style.left = mousePos.x - this.mouseOffset.x; obj.style.top = mousePos.y - this.mouseOffset.y; } } Calendar.prototype.onDragStart = function (evt) { evt = evt || window.event; var obj = this.getObjById("Calendar"); this.mouseOffset = this.getMouseOffset(obj,evt); this.drag = true; } Calendar.prototype.onDragEnd = function (evt) { this.drag = false; } Calendar.prototype.mouseCoords = function(ev) { if(ev.pageX || ev.pageY){ return {x:ev.pageX, y:ev.pageY}; } return { x:ev.clientX + document.body.scrollLeft - document.body.clientLeft, y:ev.clientY + document.body.scrollTop - document.body.clientTop }; } Calendar.prototype.getPosition = function(e) { var left = 0; var top = 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}; } Calendar.prototype.getMouseOffset = function(target, ev) { ev = ev || window.event; var docPos = this.getPosition(target); var mousePos = this.mouseCoords(ev); return {x:mousePos.x - docPos.x, y:mousePos.y - docPos.y}; } Calendar.prototype.showMenu = function(isyear) { var _menu = this.getObjById("cdrMenu"); if(isyear != null) { var _obj = (isyear)? this.getObjById("currentYear") : this.getObjById("currentMonth"); if(isyear) { this.getYearMenu(this.date.getFullYear() - 5); } else { this.getMonthMenu(); } _menu.style.top = _obj.offsetTop + _obj.offsetHeight; _menu.style.left = _obj.offsetLeft; _menu.style.width = _obj.offsetWidth; } if (this.timer != null) clearTimeout(this.timer); _menu.style.display=""; } Calendar.prototype.hideMenu = function() { var _obj = this.getObjById("cdrMenu"); this.timer = window.setTimeout(function(){_obj.style.display='none';},500); } Number.prototype.NaN0 = function() { return isNaN(this) ? 0 : this; } Date.prototype.toFormatString = function(fs) { return this.getFullYear() + fs + (this.getMonth() + 1) + fs + this.getDate(); } /*****************************************************结束************************************************************/ 普通调用: 按钮调用:
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
