注册 | 登陆

您的位置：阿里西西 > 网页特效 > 实例特效 > 详细内容

0顶

日期选择，兼容IE6、IE7和FF

稿源：互联网 2022-06-12 02:07:25 点击： 1548 撤稿纠错

常用的JS脚本，做站时经常用到，兼容火狐浏览器。

以下讨论的是和日期日历相关的日期选择，兼容IE6、IE7和FF 教程文章，内容是本站精心挑选整理的教程，希望对广大的网友给到帮助,下面是详细内容：

脚本代码(For Alixixi.com)如下:

<style type="text/css"><br>fieldset {<br> margin:5px;<br> padding:0 12px 12px 12px;<br> border:1px solid #D4D4D4;<br> background-color:#F9F9F9;<br>}<br>legend {<br> font-weight:bold;<br>}<br></style><br><fieldset><br><legend>说明</legend><br>前两年写的东东，不是很规范，可以满足一些基本的功能要求，简单的日历选择，使用浮动的Iframe可以挡住select，月份选择功能，兼容IE6、IE7和FF。<br></fieldset><br><fieldset><br> <legend>功能演示</legend><br><script language="javascript"><br>/**********************   日期选择  ***************************<br> * @作者  : Enjoyd<br> * @Email  : enjoyd@126.com<br> * @OICQ  : 5003427<br> 转载请注明出处 http://www.5aiqu.com<br>'**************************************************************************/<br>var MonthDNum=new Array(0,31,28,31,30,31,30,31,31,30,31,30,31);<br>var MonthText=new Array("","一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","十二月");<br>var Calendar_obj,Calendar_obj2;<br>//var WriteHead=1;<br>document.write('<iframe style="position:absolute;width:206px;display:none;" name="divCalendar" id="divCalendar" frameborder="0" scrolling="no"></iframe>')<br>/*头部信息CSS及JS函数*/<br>var HeadMsg='<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">'+<br>'<html xmlns="http://www.w3.org/1999/xhtml">'+<br>'<meta http-equiv="Content-Type" content="text/html; charset=utf-8"><style type="text/css"></style><scr'+<br>'ipt language="JavaScript">var mdown,sy,ey,sm,em,HideSelect=1,CurrentSelect,year,month,day;function Scroll(str,key)'+<br>'{var Html="",s,e,obj,d;'+<br>'if(key=="Y"){s=sy;e=ey;obj="SelectYearItem";d="年";}if(key=="M"){s=sm;e=em;obj="SelectMonthItem";d="";}'+<br>'if(str=="Up"){s--;e--;}if(str=="Next"){s++;e++;}'+<br>'if(key=="Y"){sy=s;ey=e;}if(key=="M"){if(s<1)s=1;if(s>6)s=6;if(e<7)e=7;if(e>12)e=12;sm=s;em=e;}'+<br>'for(i=s;i<=e;i++){Html+='<a href="javascript:;" onclick="parent.Calendar_Modif(';Html+=(key=="M")?year+','+i+','+day+');">'+parent.MonthText[i]:i+','+month+','+day+');">'+i;Html+=d+"</a>";}'+<br>'document.getElementById(obj).innerHTML=Html;}'+<br>'function KeyDown(str){if(str==38){Scroll("Up",CurrentSelect);}if(str==40){Scroll("Next",CurrentSelect);}}'+<br>'function ShowSelect(str,str2){HideSelect=0;HSelect();Scroll('',str2);document.getElementById(str).style.display="block";CurrentSelect=str2}'+<br>'function HSelect(){document.getElementById("SelectYear").style.display="none";document.getElementById("SelectMonth").style.display="none";}'+<br>'function Calendar_GetDate(y,m,d)'+<br>'{var objEvent=window.event||arguments.callee.caller.arguments[0];'+<br>'var srcElement=objEvent.srcElement;'+<br>'if(!srcElement){srcElement=objEvent.target;}'+<br>'if(srcElement.tagName=="A"){parent.Calendar_GetDate(y,m,srcElement.innerHTML);}}'+<br>'document.onclick=function(){if(HideSelect){HSelect();}HideSelect=1;}</scr'+<br>'ipt><body onkeydown="KeyDown(event.keyCode);">'+<br>'<div id="SelectYear" style="left:31px;" onclick="ShowSelect('SelectYear','Y');"><div id="Select"><a href="javascript:;" onmousedown="mdown=window.setInterval('Scroll(\'Up\',\'Y\')',50);" onmouseup="window.clearInterval(mdown);" onmouseout="window.clearInterval(mdown);" id="SelectBn" style="border-bottom:1px solid #5563B0;"><font face="Webdings">&#53;</font></a><div id="SelectYearItem">'+<br>'</div><a href="javascript:;" onmousedown="mdown=window.setInterval('Scroll(\'Next\',\'Y\')',50);" onmouseup="window.clearInterval(mdown);" onmouseout="window.clearInterval(mdown);" id="SelectBn" style="border-top:1px solid #5563B0;"><font face="Webdings">&#54;</font></a></div></div>'+<br>'<div id="SelectMonth" style="left:99px;" onclick="ShowSelect('SelectMonth','M');"><div id="Select"><a href="javascript:;" onmousedown="mdown=window.setInterval('Scroll(\'Up\',\'M\')',50);" onmouseup="window.clearInterval(mdown);" onmouseout="window.clearInterval(mdown);" id="SelectBn" style="border-bottom:1px solid #5563B0;"><font face="Webdings">&#53;</font></a><div id="SelectMonthItem">'+<br>'</div><a href="javascript:;" onmousedown="mdown=window.setInterval('Scroll(\'Next\',\'M\')',50);" onmouseup="window.clearInterval(mdown);" onmouseout="window.clearInterval(mdown);" id="SelectBn" style="border-top:1px solid #5563B0;"><font face="Webdings">&#54;</font></a></div></div>';<br>function Calendar_Show(year,month,day)<br>{<br> var content; <br> var date=new Date();<br> <br> var DayNum=(IsLeapYear(year)&&month==2)?MonthDNum[month]+1:MonthDNum[month];<br> var date2=new Date(year,month-1,1)<br> var start=date2.getDay();<br> var date2=null;<br> var Trn=Math.ceil((DayNum+start)/7);<br> <br> var PrNum=1;<br> <br> content='<scr'+<br> 'ipt language="JavaScript">year='+year+',month='+month+',day='+day+',sy=year-3;ey=year+3;'+<br> 'sm=(month-3<1)?1:(+month-3>6)?6:month-3;'+<br> 'em=(month+3<7)?7:(month+3>12)?12:month+3;</scr'+<br> 'ipt><div style="border:1px solid #6A84C8;height:'+(64+21*Trn)+'px;"><ul><li style="background:#FFF;"></li>'+<br> '<li style="width:144px;background:#FFF;padding-bottom:1px;" id="SelectArea"><div id="sYear">'+year+'年</div><div id="SArr" onclick="ShowSelect('SelectYear','Y');"><font face="Webdings">&#54;</font></div>'+<br> '<div id="sMonth">'+MonthText[month]+'</div><div id="SArr" onclick="ShowSelect('SelectMonth','M');"><font face="Webdings">&#54;</font></div>';<br> <br> <br> <br> content+='</li>'+<br> '<li><a href="javascript:parent.Calendar_hide();">×</a></li></ul>'+<br> '<div id="Tools"><ul>'+<br> '<li><a href="javascript:parent.Calendar_Modif('+(year-1)+','+month+','+day+');">&#171;</a></li>'+<br> '<li><a href="javascript:parent.Calendar_Modif('+year+','+(month-1)+','+day+')";>&#8249;</a></li>';<br> <br> if(Calendar_obj2){content+='<li style="width:42px;"><a href="javascript:parent.Calendar_GetDate('+year+','+month+',0);">本月</a></li>'+<br> '<li style="width:43px;"><a href="javascript:parent.Calendar_GetDate('+date.getFullYear()+','+(date.getMonth()+1)+','+date.getDate()+');">本日</a></li>';}<br> else{content+='<li style="width:86px;"><a href="javascript:parent.Calendar_GetDate('+date.getFullYear()+','+(date.getMonth()+1)+','+date.getDate()+');">选择本日</a></li>';}<br> <br> content+='<li><a href="javascript:parent.Calendar_Modif('+year+','+(month+1)+','+day+');">&#8250;</a></li>'+<br> '<li><a href="javascript:parent.Calendar_Modif('+(year+1)+','+month+','+day+');">&#187;</a></li>'+<br> '</ul></div>'+<br> '<div id="Title"><ul><li style="color:#F00;">日</li><li>一</li><li>二</li><li>三</li><li>四</li><li>五</li><li style="color:#F00;">六</li></ul></div>'+<br> '<ul onClick="javascript:Calendar_GetDate('+year+','+month+',-1);">';<br> <br> var date=null;<br> <br> if(start>0){content+='<li style="width:'+(start*29-1)+'px;"></li>';}<br> for(i=1;i<=DayNum;i++)<br> {<br>  content+='<li><a href="#"'<br>  content+=(day==PrNum)?' class="CurrentDate"':'';<br>  content+=((i+start)%7<2)?' style="color:#F00;"':'';<br>  content+='>'+PrNum+'</a></li>';<br>  PrNum++;<br> }<br> content+='</ul></div>';<br>//层定位<br> var Calendar=document.getElementById('divCalendar');<br> <br> <br> Calendar.style.height=66+21*Trn+'px';  //框架高度<br> divCalendar.document.open()<br> divCalendar.document.write(HeadMsg+content);<br> divCalendar.document.close()<br> <br> var p=Calendar_obj;<br> var eT=0,eL=0,eH=0,dH=0,sT=0,eP=p<br> while(p&&p.tagName!="BODY"){<br> eT+=p.offsetTop;  //距窗口顶部距离<br> eL+=p.offsetLeft;  //距窗口左边距离<br> p=p.offsetParent;}<br> var eH=eP.offsetHeight;    //输入框高度 <br> var eW=eP.offsetWidth;    //输入框宽度 <br> var dH=Calendar.style.pixelHeight; //框架高度<br> <br> Calendar.style.top=(eT+dH>document.body.scrollHeight&&eT-dH>=0)?eT-dH+'px':eT+eH+'px';<br> Calendar.style.left=(eL+206>document.body.scrollWidth&&eL-206+eW>=0)?eL-206+eW+'px':eL+'px';<br> setTimeout("document.getElementById('divCalendar').style.display=''",1);<br>}<br>/*是否润年*/<br>function IsLeapYear(y){<br>if(0==y%4&&((y%100!=0)||(y%400==0))){return true;}<br>else{return false;}<br>}<br>function Calendar_Modif(y,m,d)<br>{<br> if(m<1){m=12;y=y-1;}<br> if(m>12){m=1;y=y+1;}<br> var num=(IsLeapYear(y)&&m==2)?MonthDNum[m]+1:MonthDNum[m];<br> if(d>num){d=num;}<br> Calendar_Show(y,m,d)<br>}<br>function Calendar(obj,obj2)<br>{ <br> var p=Calendar_obj=document.getElementById(obj);<br> Calendar_obj2=document.getElementById(obj2);<br> var re=/d{4}-d{1,2}-d{1,2}/;<br> var arr,Sdate;<br> arr=re.exec(Calendar_obj.value);<br> if(arr!=null){Sdate=Calendar_obj.value;}<br> else{var mydate=new Date();<br> Sdate=mydate.getFullYear()+'-'+(mydate.getMonth()+1)+'-'+mydate.getDate();}<br> <br> Sdate=Sdate.split("-");<br> Calendar_Show(parseInt(Sdate[0]),parseInt(Sdate[1]),parseInt(Sdate[2]));<br>}<br>function Calendar_GetDate(y,m,d)<br>{<br>if(!Calendar_obj2||d!=0){<br> if(d>0){Calendar_obj.value=y+'-'+m+'-'+d;}<br> else{<br>  var objEvent=divCalendar.event||arguments.callee.caller.arguments[0];<br>  var srcElement=objEvent.srcElement;<br>  if(!srcElement){srcElement=objEvent.target;}<br>  Calendar_obj.value=y+'-'+m+'-'+srcElement.innerHTML;<br> }<br>}<br>else{<br> if(IsLeapYear(y)&&m==2){num=MonthDNum[m]+1;}<br> else{num=MonthDNum[m];}<br> Calendar_obj.value=y+'-'+m+'-1';<br> Calendar_obj2.value=y+'-'+m+'-'+num;<br>}<br>Calendar_hide();}<br>function Calendar_hide()<br>{document.getElementById("divCalendar").style.display="none";}<br>document.onclick=Calendar_hide;<br></script><br>时间:<input type="text" name="sDate1" id="sDate1" value="" size="10" onClick="return Calendar('sDate1','sDate2');" />至<input type="text" name="sDate2" id="sDate2" value="" size="10" onClick="return Calendar('sDate2');" /><br><br /><select><br><option>可挡住Select</option><br></select><br></fieldset><br><hr /><br>(c)2003-2007 www.5aiqu.com All Rights Reserved</font></P><br><a href="http://js.alixixi.com/">欢迎访问阿里西西网页特效代码站，js.alixixi.com</a>

关于日期选择，兼容IE6、IE7和FF的内容写到这里就结束啦，您可以收藏本页网址https://js.alixixi.com/a/200812164035.shtml方便下次再访问哦。

·上一篇： 信息轮换播放
·下一篇： 后退,刷新,前进js按钮

相关阅读

文章分类LIST >>返回首页

排行总榜

避免你的邮箱地址被自动收集的代码
有趣的按钮
控制用按钮打开新窗口的属性
单击按钮或图片打开IE首页
点击按钮打印该页
仿软件浮动按钮
在规定时间内方有效的按钮
一个按钮完成对文本框内容的复制
按钮选中文本框内所有内容
Windows式样的按钮

最新游戏

更多 »

最新新闻

更多 »