📄 calendar.htm

📁 可以自动悬挂在输入表单组件上辅助日期录入
💻 HTM
字号:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=gb2312">
<script language="javascript">
<!--//
var str='',i,j,yy,mm,oFont,callback;
var oInputname,oStartdate;
var wp=window.parent;
var cf=wp.document.getElementById("CalFrame");
var fld,curday,sd,ed,today=new Date();
var n_position,n_textdate,startdate,enddate,vailidday,oddeven,vailiddate,objecttype,mmm,ddd,thirdfocus;
mmm="";
today.setHours(0);today.setMinutes(0);today.setSeconds(0);today.setMilliseconds(0);
//var lastyear=today.getYear(),lastmonth=today.getMonth();

function parseDate(s)//解析日期
{
	var reg=new RegExp("[^0-9-]","")
	if(s.search(reg)>=0)return today;
	var ss=s.split("-");
	if(ss.length!=3)return today;
	if(isNaN(ss[0])||isNaN(ss[1])||isNaN(ss[2]))return today;
	return new Date(parseFloat(ss[0]),parseFloat(ss[1])-1,parseFloat(ss[2]));
}
function resizeCalendar(){cf.width=144;cf.height=192;}//设定日历宽高
function initCalendar()//初始化
{
	curday=today;
	if(oInputname&&oInputname.value.length>0){curday=parseDate(oInputname.value);}
	if(oStartdate&&oStartdate.value.length>0){curday=parseDate(oStartdate.value);}	
	if (!startdate==""){sd=parseDate(startdate)}
	if (!enddate==""){ed=parseDate(enddate)}
	//window.alert(startdate);
	//window.alert(enddate);
	drawCalendar(curday.getFullYear(),curday.getMonth());
}
function drawCalendar(y,m)//画日历?
{
	var x=new Date(y,m,1),mv=x.getDay(),d=x.getDate(),de;
	yy=x.getFullYear();mm=x.getMonth();
	document.getElementById("yyyymm").innerHTML=yy+"."+(mm+1>9?mm+1:"0"+(mm+1));
	//清空日历
	for(var i=1;i<=mv;i++)
	{
		de=document.getElementById("d"+i);
		de.innerHTML="";
		de.bgColor="";
	}
	//画日历
	while(x.getMonth()==mm)
	{
		de=document.getElementById("d"+(d+mv));
		if(x.getTime()==curday.getTime())
			de.bgColor="#4682B4";
		else
			de.bgColor="#B0E0E6";
		if(x.getTime()==today.getTime())
		{
			//window.alert(1);
			if(ifDraw(x))
			{
				de.innerHTML="<a class='css_a'  href=javascript:setDate("+d+");><font color=#B0E0E6>"+d+"</font></a>";
			}
		}
		else if(x.getTime()<today.getTime())
		{
			//window.alert(2);
			if(ifDraw(x))
			{
				de.innerHTML="<a class='css_a'  href=javascript:setDate("+d+"); class=bt>"+d+"</a>";
			}
		}	
		else
		{
			//window.alert(3);
			if(ifDraw(x))
			{	
				de.innerHTML="<a class='css_a' href=javascript:setDate("+d+");>"+d+"</a>";
			}
			else
			{
				de.innerHTML="<font color=#888888>"+d+"</font>";
			}
		}
		x.setDate(++d);
	}
	while(d+mv<=42)
	{
		de=document.getElementById("d"+(d+mv));
		de.innerHTML="";
		de.bgColor="";
		d++;
	}
}
function ifDraw(xd)
{
	if(!startdate==""&&!enddate=="")
	{
		if(xd.getTime()>=sd.getTime()&&xd.getTime()<=ed.getTime())
		{	
			if(returnOE(xd)&&returnVD(xd)&&returnVDE(xd))
			{
				return true
			}
			else
			{
				return false
			}
		}
		else
		{
			return false;
		}
	}
	else
	{
		if(returnOE(xd)&&returnVD(xd)&&returnVDE(xd))
		{
			return true
		}
		else
		{
			return false
		}
	}
}
function returnOE(xd)
{
	if(!oddeven=="")
		{
		if(oddeven=="0")
		{
			if(xd.getDate()%2==0)
			{
				return true;
			}
			else
			{
				return false;
			}
		}
		else
		{
			if(!(xd.getDate()%2==0))
			{
				return true;
			}
			else
			{
				return false;
			}
		}
	}
	else
	{
		return true;
	}
}
function returnVD(xd)
{
	if(!vailidday=="")
	{
		if(vailidday.indexOf(xd.getDay().toString())>=0)
		{
			return true;
		}
		else
		{
			return false;
		}
	}
	else
	{
		return true;
	}
}
function returnVDE(xd)
{
	if(!vailiddate=="")
	{
		if(vailiddate.indexOf(xd.getYear().toString()+"-"+(xd.getMonth()+1).toString()+"-"+xd.getDate().toString()+",")>=0)
		{
			return true;
		}
		else
		{
			return false;
		}
	}
	else
	{
		return true;
	}
}

function setDate(d)//设置日期
{
	wp.hideCalendar();
	/*
	if(mm.toString().length==1)
	{
		mmm="0"+(mm+1).toString();
	}
	else
	{
		mmm=mm+1;
	}
	if(d.toString().length==1)
	{
		ddd="0"+d.toString();
	}
	else
	{
		ddd=d;
	}
	var dstr=yy+"-"+(mmm)+"-"+ddd;
	*/
	mmm=mm+1;
	var dstr=yy+"-"+(mmm)+"-"+d;
	if(callback&&callback.length>0){eval("wp."+callback+"(\""+dstr+"\")");}
	else{oInputname.value=dstr;}
	if(!n_position==""&&!n_textdate=="")
	{		
		//wp.document.getElementById(n_textdate).value="";
		wp.showCalendar(n_position,false,n_textdate,'','',startdate,enddate,vailidday,oddeven,vailiddate,objecttype,thirdfocus,oInputname.id,true);			
	}
	else
	{
		if(!thirdfocus=="")
		{
			otd=wp.document.getElementById(thirdfocus);
			otd.focus();
		}
	}
}
//-->
</script>
<style type="text/css">
<!--
.chinese {
	font-family: "宋体";
	font-size: 9pt;
}
.english {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: xx-small;
	font-weight: bold;
	color: #FFFFFF;
}
.css_a:link {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: xx-small;
	font-weight: bold;
    text-decoration: none;
    color: #313131
}
.css_a:visited {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: xx-small;
	font-weight: bold;
    text-decoration: none;
    color: #313131;
}
.css_a:active {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: xx-small;
	font-weight: bold;
    text-decoration: none;
    color: #313131;
}
.css_a:hover{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: xx-small;
	font-weight: bold;
    text-decoration: none;
    color: #313131;
    background-color: #ffffff;
}
-->
</style>
</head>
<body leftMargin="0" topMargin="0" onload="resizeCalendar();" marginwidth="0" marginheight="0">
<table border="0" cellPadding="1" cellSpacing="0" bgColor="#4682B4" id="tbl0">
  <tr>
    <td>
      <table cellSpacing="1" cellpadding="1" width="100%" border="0">
        <tr bgColor="#4682B4">
          <td id="prev" width="25%"><a href="javascript:drawCalendar(yy,mm-1);"><img src="prev.jpg" border="0"/></a></td>
          <td id="yyyymm" width="60%" align="center" class="english"></td>
          <td id="next" width="15%"><a href="javascript:drawCalendar(yy,mm+1);"><img src="next.jpg" border="0"/></a></td>
          <td width="10%"><a href="javascript:wp.hideCalendar();"><img src="close.jpg" border="0"/></a></td>
		</tr>
	  </table>
      <table cellSpacing="1" cellPadding="1" width="142" bgColor="#4682B4" border="0">
        <tr height="18" bgColor="#ffffff">
          <td width="18" class="chinese" align="center">日</td>
          <td width="18" class="chinese" align="center">一</td>
          <td width="18" class="chinese" align="center">二</td>
          <td width="18" class="chinese" align="center">三</td>
          <td width="18" class="chinese" align="center">四</td>
          <td width="18" class="chinese" align="center">五</td>
          <td width="18" class="chinese" align="center">六</td>
	    </tr>
        <script language=javascript>
			<!--//
			for(i=0;i<6;i++)
			{
				str+="<tr height=18>";
				for(j=1;j<=7;j++)str+="<td id=d"+(i*7+j)+"  bgColor='#B0E0E6' align='center'></td>";
				str+="</tr>";
			}
			document.write(str);
			//-->
		</script>
	</table>
	</td>
  </tr>
</table>
<script language=javascript>
<!--//
var bCalLoaded=true;
//-->
</script>
</body>
</html>
💿 文件大小 20 K
👤 上传用户 huajunun
📂 所属分类 JavaScript
🏷️ 相关标签

#自动 #输入 #表单 #辅助
⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -