c_calendar.js

js简易日历

function C_Calendar(obj)
{
	if(document.getElementById("calendar"))
	{
		document.body.removeChild(document.getElementById("calendar"));
	}

	var p = new G_Panel("calendar",400,200,200,220,"orange",40,"title",'','','','');
	p.EnableClosebox();
	p.SetTitle("选择日期");
    p.Show();
    p.onCloseClick=p.Destroy;
	document.body.appendChild(p.el);

 	var today = new Date();
	this.year=today.getFullYear();
	this.month=today.getMonth()+1;
	this.date=today.getDate();
 
 
	p.SetToolbarSize("25");
	var toolbar = "";
	toolbar+="<table id='table_1' border='0' width='100%'>";
	toolbar+="<tr id='table_1_1' align=center>";
	toolbar+="<td id='table_1_1_1' onmouseover=this.className='ds_border' onmouseout=this.className='' onclick=subYear(this,\""+obj+"\") title='减小年份'>&lt;&lt;</td>";
	toolbar+="<td id='table_1_1_2' onmouseover=this.className='ds_border' onmouseout=this.className='' onclick=subMonth(this,\""+obj+"\") title='减小月份'>&lt;</td>";
	toolbar+="<td id='table_1_1_3' ><b id='year'>"+this.year+"</b><b>年</b>&nbsp;&nbsp;<b id='month'>"+this.month+"</b><b>月</b></td>";
	toolbar+="<td id='table_1_1_4' onmouseover=this.className='ds_border' onmouseout=this.className='' onclick=addMonth(this,\""+obj+"\") title='增加月份'>&gt;</td>";
	toolbar+="<td id='table_1_1_5' onmouseover=this.className='ds_border' onmouseout=this.className='' onclick=addYear(this,\""+obj+"\") title='增加年份'>&gt;&gt;</td>";
	toolbar+="</tr>";
	toolbar+="</table>";
    p.SetToolbar(toolbar);

	var html="<table id='table_2' border='0' width='100%'>";
	html+="<tr align=center>";
	html+="<td>一</td><td>二</td><td>三</td><td>四</td><td>五</td><td>六</td><td>日</td>";
	html+="</tr>";
	html+="</table>";
	html+="<table id='table_3'  border='0' width='100%' cellpadding=0 cellspacing=2 width=140 bgcolor=#EEEEEE>";
	for(var i=0;i<6;i++)
	{
		html+="<tr align=center>";
			for(var j=0;j<7;j++)
			{
			html+="<td width=10% height=16 onmouseover=if(this.innerText!=''&&this.className!='ds_border2')this.className='ds_border' onmouseout=if(this.className!='ds_border2')this.className='' onclick='C_Calendar.SetDate(this,\""+obj+"\");'></td>";
			}
		html+="</tr>";
	}
	html+="</table>";
	
	p.SetBody(html);

	p.SetFooterSize("25");
	var footbar = "<table  border='0' width='100%'><tr><td style=cursor:hand onclick='document.body.removeChild(document.getElementById(\"calendar\"))' align='center'>【关闭】</td></tr></table>";
	p.SetFooter(footbar);
	
	p.Show();
	
	C_Calendar.ShowDate(obj,eval(today.getFullYear()),eval(today.getMonth()));

}


C_Calendar.ShowDate=function(op,year,month)
{
	var myDate=new Date(year,month-1,1);
	var today=new Date();
	var day=myDate.getDay();
  
	var selectDate=document.getElementById(op).value.split('-');
	var days;
	switch(month)
	{
	case 1:
	case 3:
	case 5:
	case 7:
	case 8:
	case 10:
	case 12:
		days=31;
		break;
	case 4:
	case 6:
	case 9:
	case 11:
		days=30;
		break;
	case 2:
		if((year%4==0)&&(year%100!=0)||(year%400==0))
		days=29;
		else
		days=28;
	}

	var obj = document.getElementById("table_3");
	
	for(i=0;i<obj.cells.length;i++)
	{
	obj.cells[i].innerHTML='';
	obj.cells[i].style.color='';
	obj.cells[i].className='';
	}
	for(i=0;i<days;i++){
	obj.cells[i+day].innerHTML=(i+1);
	if(year==today.getFullYear()&&(month-1)==today.getMonth()&&(i+1)==today.getDate())
		obj.cells[i+day].style.color='red';
	if(year==eval(selectDate[0])&&month==eval(selectDate[1])&&(i+1)==eval(selectDate[2]))
		obj.cells[i+day].className='ds_border2';
  }

}

function subYear(obj,op)
{
	var y=document.getElementById("year");
	var m=document.getElementById("month");
	
	y.innerHTML=eval(y.innerHTML)-1;
	C_Calendar.ShowDate(op,eval(y.innerHTML),eval(m.innerHTML))
}

function addYear(obj,op)
{
	var y=document.getElementById("year");
	var m=document.getElementById("month");

	y.innerHTML=eval(y.innerHTML)+1;
	C_Calendar.ShowDate(op,eval(y.innerHTML),eval(m.innerHTML))
}

function subMonth(obj,op)
{
	var y=document.getElementById("year");
	var m=document.getElementById("month");

	var month=eval(m.innerHTML)-1;
	if(month==0)
	{
	month=12;
	subYear(obj,op);
	}
	m.innerHTML=month;
	C_Calendar.ShowDate(op,eval(y.innerHTML),eval(m.innerHTML))
}

function addMonth(obj,op)
{
	var y=document.getElementById("year");
	var m=document.getElementById("month");
 
	var month=eval(m.innerHTML)+1;
	if(month==13)
	{
	month=1;
	addYear(obj,op);
	}
	m.innerHTML=month;
	C_Calendar.ShowDate(op,eval(y.innerHTML),eval(m.innerHTML))
}


C_Calendar.SetDate=function(obj1,obj2)
{
	var y=document.getElementById("year").innerHTML;
	var m=document.getElementById("month").innerHTML;
	var d=obj1.innerHTML;
	if(d=="")
	{
		return;
	}
	
	var dateitem =document.getElementById(obj2);
	
	dateitem.value=y+"-"+m+"-"+obj1.innerHTML;
	
}