日期:2014-05-16 浏览次数:20591 次
/* author:zheyiw
* date:23/7/2009
* version:1.1
* 使用举例: onclick="ShowCalendar('InputBoxID','outputBoxID')"
* InputBoxID是按钮控件 outputBoxID是日期输出的文本框
*/
/* 历史版本信息:
* v1 原始版本
* v1.1 添加拖动功能, 高亮显示当天,添加:加减年份
*/
//定义一块区域
document.writeln("<div id='Calendar' style='position:absolute; z-index:1; visibility: hidden; filter:\"progid:DXImageTransform.Microsoft.Shadow(direction=135,color=#999999,strength=3)\"'></div>");
//document.writeln("<div id='Calendar' style='position:absolute; z-index:1; visibility: hidden; '></div>");
//document.writeln('<iframe id="Calendar" name=wpCalendarLayer frameborder=0 onmouseout="wpCalendar.correctPosition()" style="position: absolute; width: 153; height: 208; z-index: 9998; display: none"></iframe>');
//输出数据变量
var outputData;
//确定日历位置,显示当前日期
function ShowCalendar(InputBox,outputBox)
{
outputData=document.getElementById(outputBox);
var x,y;
// var o=eval("document.all."+InputBox); // var o=eval("document.getElementById(InputBox)");
//控制控件出现的位置
var o=document.getElementById(InputBox); //传入字符串时
x=o.offsetLeft;
y=o.offsetTop;
while(o=o.offsetParent)
{
x+=o.offsetLeft;
y+=o.offsetTop;
}
document.getElementById("Calendar").style.left=x+2+"px";
document.getElementById("Calendar").style.top=y+20+"px";
document.getElementById("Calendar").style.visibility="visible"; //显示div
var objdate=new Date();
MainCalendar(objdate.getYear(),objdate.getMonth(),objdate.getDate());
}
//绘制日历
function MainCalendar(year,month,day)
{
var intLoop,intWeeks,intDays;
var DivContent="";
//插入一个表格
var objdate=new Date();
var firstDay=new Date(year, month, 1).getDay(); //得到第一天是星期几
var maxday=new Date(year, month+1, 0).getDate(); //得到当前月的天数
DivContent+="<table border='0' cellspacing='0' style='border:1px solid #0066FF; background-color:#EDF2FC'>";
var strMonthMin="monthMin("+ year +","+ month +","+ day +")";
var strMonthAdd="monthAdd("+ year +","+ month +","+ day +")";
var strYearMin="yearMin("+ year +","+ month +","+ day +")";
var strYearAdd="yearAdd("+ year +","+ month +","+ day +")";
DivContent+="<tr><td align=center ><input type='button' onclick="+ strMonthAdd +" value='<'/> </td>"
DivContent+="<td align=center ><input type='button' onclick="+ strYearMin +" value='<<'/> </td>" //年份减
DivContent+="<td align=center colspan=3>"+ year +":"+ (month+1) +"</td>"
DivContent+="<td align=center ><input type='button' onclick="+ strYearAdd +" value='>>'/> </td> " //年份加
DivContent+="<td align=center ><input type='button' onclick="+ strMonthMin +" value='>'/> </td></tr>";
DivContent+="<tr id='moveTR' style='cursor: move ' onmousedown='DragStart()' onmouseup='DragEnd()'><td>日</td><td>一</td><td>二</td><td>三</td><td>四</td><td>五</td><td>六</td><tr>";
var d=1,dd=1;
for(var i=0;i<6;i++)
{
DivContent+="<tr>";
var strOutData="outData(this,"+ year +","+ month +")";
for(var j=1;j<8;j++)
{
if(d<=firstDay || dd>maxday) { DivContent+="<td> </td>";}
else if(dd==Number(objdate.getDate()) && month==Number(objdate.getMonth()) && year==Number(objdate.getYear())) {
DivContent+="<td bgcolor='silver' onmouseover='MouseOver(this)' onmouseout='MouseOut(this)' onclick="+strOutData+">"+dd+"</td>";
dd++;
}
else {
DivContent+="<td onmouseover='MouseOver(this)' onmouseout='MouseOut(this)' onclick="+strOutData+">"+dd+"</td>";
dd++;
}
d++;
}
DivContent+="</tr>";
}
DivContent+="</table>";