提供了编程的基础技术教程

zl程序教程

您现在的位置是：首页 >  前端

当前栏目

基于JQuery的日期联动实现代码

jQuery日期代码 实现 基于 联动
2023-06-13 09:14:27 时间

实现目标：

两个日期，有下拉框：

复制代码代码如下:

<head>
//导入jquery地址
<scriptsrc="（Jquery地址）"language="JavaScript"type="text/javascript"></script>
<scripttype="text/javascript">
//startYear发生变化
functionchangeYear(str,isstart)
{
varpre="start";
if(isstart==false)
{
pre="end";
}
varstartMonth=$(pre+"Month").value;
if(startMonth=="")
{
vare=$(pre+"Month");
optionClear(e);
return;
}
varn=MonHead[startMonth-1];
if(startMonth==2&&IsPinYear($(pre+"Year").value))
{
n++;
}
writeDay(n,pre);
}
functionchangeMonth(str,isstart)
{
varpre="start";
if(isstart==false)
{
pre="end";
}
varyear=$(pre+"Year").value;
if(year=="")
{
vare=$(pre+"Day");
optionClear(e);
return;
}
varn=MonHead[str-1];
if(str==2&&IsPinYear($(pre+"Year")))
{
n++;
}
writeDay(n,pre);
}
functiondateStart()
{
vardefaultStartY="2011";
vardefaultStartM="1";
vardefaultStartD="14";
vardefaultEndY="2011";
vardefaultEndM="2";
vardefaultEndD="23";
MonHead=[31,28,31,30,31,30,31,31,30,31,30,31];
varprestr=newArray("start","end");
for(varj=0;j<2;j++)
{
varpre=prestr[j];
//start年
vary=newDate().getFullYear();
if(pre=="start")
{
//start初始选中前第10天
vari_index=0;
for(vari=(y-10);i<=y;i++)
{
$(pre+"Year").options.add(newOption(""+i+"",i));
if(i==defaultStartY)
{
$(pre+"Year").options[i_index].selected=true;
}
i_index++;
}
}
else
{
vari_index=0;
for(vari=(y-5);i<=y+5;i++)
{
$(pre+"Year").options.add(newOption(""+i+"",i));
if(i==defaultEndY)
{
$(pre+"Year").options[i_index].selected=true;
}
i_index++;
}
}
//start月
defaultM=(pre=="start"?defaultStartM:defaultEndM)
for(vari=1;i<13;i++)
{
$(pre+"Month").options.add(newOption(""+i+"",i));
if(i==defaultM)
{
$(pre+"Month").options[i-1].selected=true;
}
}
//start日
varn=MonHead[$(pre+"Month").value];
if(newDate().getMonth==1&&IsPinYear($(pre+"Year").value))
{
n++;
}
defaultD=(pre=="start"?defaultStartD:defaultEndD)
writeDay(n,pre);
$(pre+"Day").options[defaultD-1].selected=true;
}
}
functionwriteDay(n,pre)
{
vare=$(pre+"Day");
optionClear(e);
for(vari=1;i<(n+1);i++)
{
e.options.add(newOption(""+i+"",i));
}
}
functionIsPinYear(year)
{
return(0==year%4&&(year%100!=0||year%4==0));
}
functionoptionClear(e)
{
for(vari=e.options.length;i>=0;i--)
{
e.remove(i);
}
}
</script>
</head>
<bodyonload="dateStart()">
<pname="selectdate">
从
<selectid="startYear"name="startYear"onchange="changeYear(this.value,true)">
</select>
年
<selectid="startMonth"name="startMonth"onchange="changeMonth(this.value,true)">
</select>
月
<selectid="startDay"name="startDay">
</select>
日
到
<selectid="endYear"name="endYear"onchange="changeYear(this.value,false)">
</select>
年
<selectid="endMonth"name="endMonth"onchange="changeMonth(this.value,false)">
</select>
月
<selectid="endDay"name="endDay">
</select>
日
</p>
</body>

参考了一些代码，希望对需要的朋友有所帮助。

相关文章