日本語
<HTML> <HEAD> <TITLE>便利な中英文日历网页特效代码-downcodes.com</TITLE> <!--<script language="javascript" src="PopupCalendar.js" ></script>-- > <script> //downcodes.com からの詳細 function PopupCalendar(InstanceName) { ///グローバル タグ this.instanceName=InstanceName; ///プロパティ this.separator="-" this.oBtnTodayTitle="今日" this.oBtnCancelTitle="キャンセル" this.weekDaySting=new Array("S","M","T","W","T) "、"F"、"S"); this.monthSting=new Array("1 月","2 月","3 月","4 月","5 月","6 月","7 月","8 月","9 月","10 月","11 月" 、"12月"）; this.Width=200; this.currDate=新しい日付(); this.today=新しい日付(); this.startyear=1970; this.end Year=2010; ///Css this.divBorderCss="1px ソリッド #BCD0DE"; this.tableBorderColor="#CCCCCC" ///メソッド this.Init=CalendarInit; this.Fill=CalendarFill; this.Refresh=CalendarRefresh; this.Restore=CalendarRestore; ///HTMLObject this.oTaget=null; this.oPreviousCell=null; this.sDIVID=インスタンス名+"oDiv"; this.sTABLEID=インスタンス名+"oTable"; this.sMONTHID=インスタンス名+"oMonth"; this.sYEARID=インスタンス名+"o年"; } function CalendarInit() ///パネルの作成 { var sMonth,syear sMonth=this.currDate.getMonth(); syear=this.currDate.get Year(); htmlAll="<div id='"+this.sDIVID+"' style='display:none;position:absolute;width:"+this.Width+";border:"+this.divBorderCss+";padding:2px;background-色:#FFFFFF'>"; htmlAll+="<div align='center'>"; /// 月 htmloMonth="<select id='"+this.sMONTHID+"' onchange=CalendarMonthChange("+this.instanceName+") style='width:50%'>"; for(i=0;i<12;i++) { htmloMonth+="<option value='"+i+''>"+this.monthSting[i]+"</option>"; } htoMonth+="</select>"; /// 年 htoyyy="<select id='"+this.sYEARID+"' onchange=Calendar YearChange("+this.instanceName+") style='width:50%'>"; for(i=this.start Year;i<=this.end Year;i++) { htoyy+="<option value='"+i+"'>"+i+"</option>"; htoyear+="</select></div>"; /// 日 hhtmloDayTable="<table id='"+this.sTABLEID+"' width='100%' border=0 cellpadding=0 cellpacing=1 bgcolor='"+this.tableBorderColor+"'>"; htodayTable+="<tbody bgcolor='#ffffff'style='font-size:13px'>"; for(i=0;i<=6;i++) { if(i==0) htoDayTable+="<tr bgcolor='#98B8CD'>";それ以外の場合は htoDayTable+="<tr>"; for(j=0;j<7;j++) { if(i==0) { htoDayTable+="<td height='20' align='center' valign='middle' style='cursor:hand'>" ; htmloDayTable+=this.weekDaySting[j]+"</td>" } else { htmloDayTable+="<td height='20' align='center' valign='middle' style='cursor:hand'"; htmloDayTable+=" onmouseover=CalendarCellsMsOver("+this.instanceName+")"; htmloDayTable+=" onmouseout=CalendarCellsMsOut("+this.instanceName+")"; htmloDayTable+=" onclick=CalendarCellsClick(this,"+this.instanceName+")>"; htodayTable+=" </td>" } } htodayTable+="</tr>"; } htoDayTable+="</tbody></table>"; /// 今日のボタン htoButton="<div align='center' style='padding:3px'>" htmloButton+="<button style='width:40%;border:1px Solid #BCD0DE;background-color:#eeeeee ;cursor:hand'" htmloButton+=" onclick=CalendarTodayClick("+this.instanceName+")>"+this.oBtnTodayTitle+"</button> " htmloButton+="<button style='width:40%;border:1px Solid # BCD0DE;background-color:#eeeeee;cursor:hand'" htmloButton+=" onclick=CalendarCancel("+this.instanceName+")>"+this.oBtnCancelTitle+"</button> " hhtmloButton+="</div>" // / すべて htmlAll=htmlAll+htmloMonth+htmlo Year+htmloDayTable+htmloButton+"</div>"; document.write(htmlすべて); this.Fill(); } function CalendarFill() /// { var sMonth,s Year,sWeekDay,sToday,oTable,currRow,MaxDay,sDaySn,sIndex,rowIndex,cellIndex,oSelectMonth,oSelect Year sMonth=this.currDate.getMonth(); syear=this.currDate.get Year(); sWeekDay=(新しい日付(s年,s月,1)).getDay(); sToday=this.currDate.getDate(); oTable=document.all[this.sTABLEID]; currRow=oTable.rows[1]; MaxDay=CalendarGetMaxDay(s年,s月); oSelectMonth=document.all[this.sMONTHID] oSelectMonth.selectedIndex=sMonth; oSelectyear=document.all[this.sYEARID] for(i=0;i<oSelect Year.length;i++) { if(parseInt(oSelectyear.options[i].value)==syear)oSelectyear.selectedIndex=i; } //// for(sDaySn=1,sIndex=sWeekDay;sIndex<=6;sDaySn++,sIndex++) { if(sDaySn==sToday) { currRow.cells[sIndex].innerHTML="<font color=red>< i><b>"+sDaySn+"</b></i></font>"; this.oPreviousCell=currRow.cells[sIndex]; } else { currRow.cells[sIndex].innerHTML=sDaySn; currRow.cells[sIndex].style.color="#666666"; CalendarCellSetCss(0,currRow.cells[sIndex]); } for(rowIndex=2;rowIndex<=6;rowIndex++) { if(sDaySn>MaxDay)break; currRow=oTable.rows[rowIndex]; for(cellIndex=0;cellIndex<currRow.cells.length;cellIndex++) { if(sDaySn==sToday) { currRow.cells[cellIndex].innerHTML="<font color=red><i><b>"+sDaySn+ "</b></i></font>"; this.oPreviousCell=currRow.cells[cellIndex]; } else { currRow.cells[cellIndex].innerHTML=sDaySn; currRow.cells[cellIndex].style.color="#666666"; CalendarCellSetCss(0,currRow.cells[cellIndex]); sDaySn++; if(sDaySn>MaxDay)break; } } } function CalendarRestore() /// データのクリア { var oTable oTable=document.all[this.sTABLEID] for(i=1;i<oTable.rows.length;i++) { for(j=0;j< oTable.rows[i].cells.length;j++) { CalendarCellSetCss(0,oTable.rows[i].cells[j]); oTable.rows[i].cells[j].innerHTML=" "; } } } function CalendarRefresh(newDate) /// { this.currDate=newDate; this.Restore(); this.Fill(); } function CalendarCellsMsOver(oInstance) /// Cell MouseOver { var myCell myCell=event.srcElement; CalendarCellSetCss(0,oInstance.oPreviousCell); if(myCell) { CalendarCellSetCss(1,myCell); oInstance.oPreviousCell=myCell; } } function CalendarCellsMsOut(oInstance) ////// Cell MouseOut { var myCell myCell=event.srcElement; CalendarCellSetCss(0,myCell); } function CalendarCellsClick(oCell,oInstance) { var sDay,sMonth,s Year,newDate syear=oInstance.currDate.getFull Year(); sMonth=oInstance.currDate.getMonth(); sDay=oInstance.currDate.getDate(); if(oCell.innerText!=" ") { sDay=parseInt(oCell.innerText); if(sDay!=oInstance.currDate.getDate()) { newDate=新しい日付(s年,s月,s日); oInstance.Refresh(newDate); sDateString=s Year+oInstance.separator+CalendarDblNum(sMonth+1)+oInstance.separator+CalendarDblNum(sDay); ///return sDateString if(oInstance.oTaget.tagName=="INPUT") { oInstance.oTaget.value=sDateString; document.all[oInstance.sDIVID].style.display="none"; } function CalendaryearChange(oInstance) /// 年の変更 { var sDay,sMonth,s Year,newDate sDay=oInstance.currDate.getDate(); sMonth=oInstance.currDate.getMonth(); s年=document.all[oInstance.sYEARID].value newDate=新しい日付(s年,s月,s日); oInstance.Refresh(newDate); } function CalendarMonthChange(oInstance) /// 月の変更 { var sDay,sMonth,s Year,newDate sDay=oInstance.currDate.getDate(); sMonth=document.all[oInstance.sMONTHID].value syear=oInstance.currDate.get Year(); newDate=新しい日付(s年,s月,s日); oInstance.Refresh(newDate); } function CalendarTodayClick(oInstance) /// 「今日」ボタン 変更 { oInstance.Refresh(new Date()); } function getDateString(oInputSrc,oInstance) { if(oInputSrc&&oInstance) { CalendarDiv=document.all[oInstance.sDIVID]; oInstance.oTaget=oInputSrc; CalendarDiv.style.pixelLeft=CalendargetPos(oInputSrc,"左"); CalendarDiv.style.pixelTop=CalendargetPos(oInputSrc,"Top")+oInputSrc.offsetHeight; CalendarDiv.style.display=(CalendarDiv.style.display=="none")?"":"none"; } } function CalendarCellSetCss(sMode,oCell) /// セル Css を設定 { // sMode // 0: OnMouserOut 1: OnMouseOver if(sMode) { oCell.style.border="1px Solid #5589AA"; oCell.style.backgroundColor="#BCD0DE"; } else { oCell.style.border="1px ソリッド #FFFFFF"; oCell.style.backgroundColor="#FFFFFF"; function CalendarGetMaxDay(now Year,nowMonth) /// 現在の月の MaxDay を取得します { var nextMonth,nextyear,currDate,nextDate,theMaxDay nextMonth=nowMonth+1; if(nextMonth>11) { nextyear=nowyear+1;次の月=0; } else {次年=今年; currDate=新しい日付(今年,今月,1); nextDate=新しい日付(来年,翌月,1); theMaxDay=(nextDate-currDate)/(24*60*60*1000); MaxDay を返します。 } function CalendargetPos(el,ePro) /// 絶対位置を取得 { var ePos=0; while(el!=null) { ePos+=el["オフセット"+ePro]; el=el.offsetParent; ePos を返します。 } function CalendarDblNum(num) { if(num<10) return "0"+num;それ以外の場合は数値を返します。 } function CalendarCancel(oInstance) ///キャンセル { CalendarDiv=document.all[oInstance.sDIVID]; CalendarDiv.style.display="none"; } </script> </head> <BODY > <script > var oCalendarEn=new PopupCalendar("oCalendarEn"); //初期化制御プログラム時に、名前例が表示されます:oCalendarEn oCalendarEn.Init(); var oCalendarChs=new PopupCalendar("oCalendarChs"); //初期化制御件時,请给出实例名:oCalendarChs oCalendarChs.weekDaySting=new Array("日","一","二","三","四","五","六"); oCalendarChs.monthSting=new Array("一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","十二月"); oCalendarChs.oBtnTodayTitle="今天"; oCalendarChs.oBtnCancelTitle="取消"; oCalendarChs.Init(); </script> <br><br><br><br> <input readonly type="text" name="dd" id="aa" onClick="getDateString(this,oCalendarEn)" value="英語版" > <br><br><br><br> <input readonly type="text" name="dd" id="aa" onClick="getDateString(this,oCalendarChs)" value="中文界面版"> < /BODY> </HTML>
