又是一个不错的JS日历控件

Code

calendar_new.js

//???????堕?磋???绰?

var?date_start,date_end,g_object

var?today?=?new?Date();

var?separator="-";

var?inover=false;

//mode?:?堕?村???㈢??绫诲??0-骞绰?1-???2-?存?ラ???╂??

function?change_date(temp,mode)

{

?var?t_month,t_year

????if?(mode){

????????if(mode==1)

????????t_month=parseInt(cele_date_month.value,10)+parseInt(temp,10);

????????else

????????t_month=parseInt(temp)

????????if?(t_month<cele_date_month.options(0).text)?{

????????????cele_date_month.value=cele_date_month.options(cele_date_month.length-1).text;

????????????change_date(parseInt(cele_date_year.value,10)-1,0);

????????????}

????????else{

????????????if?(t_month>cele_date_month.options(cele_date_month.length-1).text){

????????????????cele_date_month.value=cele_date_month.options(0).text;

????????????????change_date(parseInt(cele_date_year.value,10)+1,0);

????????????????}????????????

????????????else

????????????????{cele_date_month.value=t_month;

?????????????????set_cele_date(cele_date_year.value,cele_date_month.value);????????????????

????????????????}

????????}

????}??

????else{

????????t_year=parseInt(temp,10);

????????

????????if?(t_year<cele_date_year.options(0).text)?{

????????????cele_date_year.value=cele_date_year.options(0).text;

????????????set_cele_date(cele_date_year.value,1);????????????????

????????????}

????????else{

????????????if?(parseInt(t_year,10)>parseInt(cele_date_year.options(cele_date_year.length-1).text,10)){

????????????????cele_date_year.value=cele_date_year.options(cele_date_year.length-1).text;

????????????????set_cele_date(cele_date_year.value,12);????????????????

????????????????}????????????

????????????else

????????????????{cele_date_year.value=t_year;

?????????????????set_cele_date(cele_date_year.value,cele_date_month.value);????????????????

????????????????}

????????}

????}

????

????window.cele_date.focus();

????

}

//??濮????ュ??

function?init(d_start,d_end)

{

?????var?temp_str;

?????var?i=0

?????var?j=0

?????date_start=new?Date(2000,7,1)

?????date_end=new?Date(2004,8,1)

?????

?????//蹇?椤昏?????瀹癸?濂???锛?

?????

?????document.writeln("<div?name=\"cele_date\"?id=\"cele_date\"??style=\"display:none\"????style=\"LEFT:?69px;?POSITION:?absolute;?TOP:?159px;Z-INDEX:99\"?onClick=\"event.cancelBubble=true;\"?onBlur=\"hilayer()\"?onMouseout=\"lostlayerfocus()\">??</div>");

?????

?????window.cele_date.innerHTML="";

?????temp_str="<table?border=\"1\"?bgcolor=\"#9FCC88\"?bordercolor=\"white\"><tr><td?colspan=7?onmouseover=\"overcolor(this)\">";

?????temp_str+="<input?type=\"Button\"?value=\"<<\"?onclick=\"change_date(-1,1)\"?onmouseover=\"getlayerfocus()\"?style=\"color:?#FFFFFF;?background-color:?#9FCC88;?cursor:?hand\">";//宸??㈢??绠?澶?

?????

?????temp_str+=""//骞? ?????temp_str+="<select?name=\"cele_date_year\"?id=\"cele_date_year\"?language=\"javascript\"?onchange=\"change_date(this.value,0)\"?onmouseover=\"getlayerfocus()\"?onblur=\"getlayerfocus()\"?style=\"font-size:?9pt;?border:?1px?#666666?outset;?background-color:?#9FCC88\">"

?????

?????for?(i=1985;i<=2010;i++)

?????{

?????temp_str+="<OPTION?value=\""+i.toString()+"\">"+i.toString()+"</OPTION>";

?????}

?????temp_str+="</select>骞?;

?????temp_str+=""//??

?????temp_str+="<select?name=\"cele_date_month\"?id=\"cele_date_month\"?language=\"javascript\"?onchange=\"change_date(this.value,2)\"?onmouseover=\"getlayerfocus()\"?onblur=\"getlayerfocus()\"?style=\"font-size:?9pt;?border:?1px?#666666?outset;?background-color:?#9FCC88\">"

?????

?????for?(i=1;i<=12;i++)

?????{

?????temp_str+="<OPTION?value=\""+i.toString()+"\">"+i.toString()+"</OPTION>";

?????}

?????temp_str+="</select>??";

?????temp_str+=""//?崇??澶? ?????temp_str+="<input?type=\"Button\"?value=\">>\"?慰nclick=\"change_date(1,1)\"?慰nm慰use慰ver=\"getlayerfocus()\"??style=\"color:?#FFFFFF;?background-color:?#9FCC88;?cursor:?hand\">";

?????

?????temp_str+="</td></tr><tr><td?onmouseover=\"overcolor(this)\">"

?????temp_str+="<font?color=red>Su</font></td><td>";temp_str+="Mo</td><td>";?temp_str+="Tu</td><td>";?temp_str+="We</td><td>"

?????temp_str+="Th</td><td>";temp_str+="Fr</td><td>";?temp_str+="Sa</td></tr>";

?????for?(i=1?;i<=6?;i++)

?????{

?????temp_str+="<tr>";

????????for(j=1;j<=7;j++){

????????????temp_str+="<td?name=\"c"+i+"_"+j+"\"id=\"c"+i+"_"+j+"\"?style=\"CURSOR:?hand\"?style=\"COLOR:#000000\"?language=\"javascript\"?onmouseover=\"overcolor(this)\"?onmouseout=\"outcolor(this)\"?onclick=\"td_click(this)\">?</td>"

????????????}

?????temp_str+="</tr>"????????

?????}

?????temp_str+="</td></tr></table>";

?????window.cele_date.innerHTML=temp_str;

}

function?set_cele_date(year,month)

{

???var?i,j,p,k

???var?nd=new?Date(year,month-1,1);

???event.cancelBubble=true;

???cele_date_year.value=year;

???cele_date_month.value=month;???

???k=nd.getDay()-1

???var?temp;

???for?(i=1;i<=6;i++)

??????for(j=1;j<=7;j++)

??????{

??????eval("c"+i+"_"+j+".innerHTML=\"\"");

??????eval("c"+i+"_"+j+".bgColor=\"#9FCC88\"");

??????eval("c"+i+"_"+j+".style.cursor=\"hand\"");

??????}

???while(month-1==nd.getMonth())

????{?j=(nd.getDay()?+1);

??????p=parseInt((nd.getDate()+k)?/?7)+1;

??????eval("c"+p+"_"+j+".innerHTML="+"\""+nd.getDate()+"\"");

??????if?((nd.getDate()==today.getDate())&&(cele_date_month.value==today.getMonth()+1)&&(cele_date_year.value==today.getYear())){

????????eval("c"+p+"_"+j+".bgColor=\"#EFFB64\"");

??????}

??????if?(nd>date_end?||?nd<date_start)

??????{

??????eval("c"+p+"_"+j+".bgColor=\"#FF9999\"");

??????eval("c"+p+"_"+j+".style.cursor=\"text\"");

??????}

??????nd=new?Date(nd.valueOf()?+?86400000)

????}

}

//s_object锛??瑰?荤??瀵硅薄锛?d_start-d_end???????堕?村?烘?碉???瑕?瀛??惧?肩???т欢锛?

function?show_cele_date(eP,d_start,d_end,t_object)

{

window.cele_date.style.display="";

window.cele_date.style.zIndex=99

var?s,cur_d

var?eT?=?eP.offsetTop;??

var?eH?=?eP.offsetHeight+eT;??

var?dH?=?window.cele_date.style.pixelHeight;??

var?sT?=?document.body.scrollTop;?

var?sL?=?document.body.scrollLeft;?

event.cancelBubble=true;

window.cele_date.style.posLeft?=?event.clientX-event.offsetX+sL-5;??

window.cele_date.style.posTop?=?event.clientY-event.offsetY+eH+sT-5;

if?(window.cele_date.style.posLeft+window.cele_date.clientWidth>document.body.clientWidth)?window.cele_date.style.posLeft+=eP.offsetWidth-window.cele_date.clientWidth;

//if?(window.cele_date.style.posTop+window.cele_date.clientHeight>document.body.clientHeight)?window.cele_date.style.posTop-=(eP.offsetHeight+window.cele_date.clientHeight+5);

if?(d_start!=""){

????if?(d_start=="today"){

????????date_start=new?Date(today.getYear(),today.getMonth(),today.getDate());

????}else{

????????s=d_start.split(separator);

????????date_start=new?Date(s[0],s[1]-1,s[2]);

????}

}else{

????date_start=new?Date(1900,1,1);

}

if?(d_end!=""){

????s=d_end.split(separator);

????date_end=new?Date(s[0],s[1]-1,s[2]);

}else{

????date_end=new?Date(3000,1,1);

}

g_object=t_object

cur_d=new?Date()

set_cele_date(cur_d.getYear(),cur_d.getMonth()+1);

window.cele_date.style.display="block";

window.cele_date.focus();

}

function?td_click(t_object)

{

var?t_d

if?(parseInt(t_object.innerHTML,10)>=1?&&?parseInt(t_object.innerHTML,10)<=31?)?

{?t_d=new?Date(cele_date_year.value,cele_date_month.value-1,t_object.innerHTML)

if?(t_d<=date_end?&&?t_d>=date_start)

{

var?year?=?cele_date_year.value;

var?month?=?cele_date_month.value;

var?day?=?t_object.innerHTML;

if?(parseInt(month)<10)?month?=?"0"?+?month;

if?(parseInt(day)<10)?day?=?"0"?+?day;

g_object.value=year+separator+month+separator+day;

window.cele_date.style.display="none";};

}

function?h_cele_date()

{

window.cele_date.style.display="none";

}

function?overcolor(obj)

{

??if?(obj.style.cursor=="hand")?obj.style.color?=?"#FFFFFF";

??inover=true;

??window.cele_date.focus();

}

function?outcolor(obj)

{

??obj.style.color?=?"#000000";

??inover=false;

}

function?getNow(o){

????var?Stamp=new?Date();

????var?year?=?Stamp.getYear();

????var?month?=?Stamp.getMonth()+1;

????var?day?=?Stamp.getDate();

????if(month<10){

?month="0"+month;

????}

????if(day<10){

?day="0"+day;

????}

????o.value=year+separator+month+separator+day;

}

function?hilayer()

{

?if?(inover==false)

??var?lay=document.all.cele_date;

??lay.style.display="none";

}

function?getlayerfocus()

{

?inover=true;

}

function?lostlayerfocus()

{

?inover=false;

}

//-->

WebForm3.aspx

<%@?Page?Language="C#"?ContentType="text/html"?ResponseEncoding="gb2312"?%>

<!DOCTYPE?html?PUBLIC?"-//W3C//DTD?XHTML?1.0?Transitional//EN"?"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html?xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>????棰???妗?lt;/title>

<!--

.input?{

?border:?1px?solid?#666666;

}

-->

</style>

init();

</script>

</head>

<body>

<form?id="form1"?runat="server">

<input?type="text"?name="F_Date"?size="20"?maxlength="19"??value="<%=DateTime.Now.ToString("yyy-MM-dd")%>">

<input?type="button"?name="change2"?class="input"??value="

又是一个不错的JS日历控件

"??onClick="show_cele_date(change2,'','',F_Date)">

</form>

</body>

</html>

杞?杞戒?:https://www.cnblogs.com/yuji/archive/2009/05/05/1449383.html

又是一个不错的JS日历控件

继续阅读

JavaScript自学笔记【4】函数的声明与调用目录二、函数的声明三、函数的调用

请求超时VUE axios重新再次请求

七牛云-C#SDK-上传-前期准备

nodejs微信开发---授权登录+获取用户信息微信网页授权

debian9升级4.9.0内核到4.19.2内核过程

Javascript构建Bingo卡片游戏

JavaScript的那些坑之事件代理事件代理事件阶段

javascript的for (var i in data)慎用javascript中的for (var i in data)谨慎用

tab鼠标经过菜单切换

vue （vue2.0）使用总结(从大体结构总结)

vue搭建过程及出现问题

/\B(?=(?:\d{3})+$)/g 一条令人费解的正则表达式

适用于JavaScript的ECMAScript 2020规范向前发展

JS生成uuid的四种方法

layui多任务上传添加进度条