ภาษาไทย
<HTML> <HEAD> <TITLE>มี用的中英文日历网页特效代码-downcodes.com</TITLE> <!--<script language="javascript" src="PopupCalendar.js" ></script>-- > <script> //เพิ่มเติมจากฟังก์ชัน downcodes.com PopupCalendar(InstanceName) { ///Global Tag this.instanceName=InstanceName; ///คุณสมบัติ this.separator="-" this.oBtnTodayTitle="วันนี้" this.oBtnCancelTitle="ยกเลิก" this.weekDaySting=new Array("S", "M", "T", "W", "T" ","ฉ"ส"); this.monthSting=new Array("มกราคม", "กุมภาพันธ์", "มีนาคม", "เมษายน", "พฤษภาคม", "มิถุนายน", "กรกฎาคม", "สิงหาคม", "กันยายน", "ตุลาคม", "พฤศจิกายน" ,"ธันวาคม"); นี่ความกว้าง=200; this.currDate=วันที่ใหม่(); this.today=วันใหม่(); this.startYear=1970; this.endYear=2010; ///Css this.divBorderCss="1px ทึบ #BCD0DE"; this.tableBorderColor="#CCCCCC" ///Method this.Init=CalendarInit; this.Fill=ปฏิทินเติม; this.Refresh=ปฏิทินรีเฟรช; this.Restore=CalendarRestore; ///HTMLObject this.oTaget=null; this.oPreviousCell=null; this.sDIVID=ชื่ออินสแตนซ์+"oDiv"; this.sTABLEID=InstanceName+"oTable"; this.sMONTHID=InstanceName+"oMonth"; this.sYEARID=InstanceName+"oYear"; } ฟังก์ชั่น CalendarInit() /// สร้างแผง { var sMonth,sYear sMonth=this.currDate.getMonth(); sYear=this.currDate.getYear(); htmlAll="<div id='"+this.sDIVID+"' style='display:none;position:absolute;width:"+this.Width+";border:"+this.divBorderCss+";padding:2px;พื้นหลัง- สี:#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>"; } htmloMonth+="</select>"; /// Year htmloYear="<select id='"+this.sYEARID+"' onchange=CalendarYearChange("+this.instanceName+") style='width:50%'>"; for(i=this.startYear;i<=this.endYear;i++) { htmloYear+="<option value='"+i+"'>"+i+"</option>"; } htmloYear+="</select></div>"; /// วัน htmloDayTable="<table id='"+this.sTABLEID+"' width='100%' border=0 cellpadding=0 cellspacing=1 bgcolor='"+this.tableBorderColor+"'>"; htmloDayTable+="<tbody bgcolor='#ffffff'style='font-size:13px'>"; สำหรับ(i=0;i<=6;i++) { if(i==0) htmloDayTable+="<tr bgcolor='#98B8CD'>"; else htmloDayTable+="<tr>"; for(j=0;j<7;j++) { if(i==0) { htmloDayTable+="<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+")>"; htmloDayTable+=" </td>" } } htmloDayTable+="</tr>"; } htmloDayTable+="</tbody></table>"; /// ปุ่มวันนี้ htmloButton="<div align='center' style='padding:3px'>" htmloButton+="<button style='width:40%;border:1px solid #BCD0DE;สีพื้นหลัง:#eeeeee ;cursor:hand'" htmloButton+=" onclick=CalendarTodayClick("+this.instanceName+")>"+this.oBtnTodayTitle+"</button> " htmloButton+="<button style='width:40%;border:1px solid # BCD0DE;สีพื้นหลัง:#eeeeee;cursor:hand'" htmloButton+=" onclick=CalendarCancel("+this.instanceName+")>"+this.oBtnCancelTitle+"</button> " htmloButton+="</div>" // / ทั้งหมด htmlAll=htmlAll+htmloMonth+htmloYear+htmloDayTable+htmloButton+"</div>"; document.write(htmlทั้งหมด); นี้.เติม(); } ฟังก์ชัน CalendarFill() /// { var sMonth,sYear,sWeekDay,sToday,oTable,currRow,MaxDay,sDaySn,sIndex,rowIndex,cellIndex,oSelectMonth,oSelectYear sMonth=this.currDate.getMonth(); sYear=this.currDate.getYear(); sWeekDay=(วันที่ใหม่(sYear,sMonth,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<oSelectYear.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]; } อื่น ๆ { currRow.cells[sIndex].innerHTML=sDaySn; currRow.cells[sIndex].style.color="#666666"; } CalendarCellSetCss(0,currRow.cells[sIndex]); } สำหรับ(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]; } อื่น ๆ { currRow.cells[cellIndex].innerHTML=sDaySn; currRow.cells[cellIndex].style.color="#666666"; } CalendarCellSetCss(0,currRow.cells[cellIndex]); sDaySn++; ถ้า(sDaySn>MaxDay)หยุด; } } } ฟังก์ชั่น 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].เซลล์[j].innerHTML=" "; } } } ฟังก์ชั่น CalendarRefresh(newDate) /// { this.currDate=newDate; นี้.คืนค่า(); นี้.เติม(); } ฟังก์ชั่น CalendarCellsMsOver (oInstance) /// Cell MouseOver { var myCell myCell=event.srcElement; CalendarCellSetCss(0,oInstance.oPreviousCell); ถ้า (myCell) { CalendarCellSetCss (1, myCell); oInstance.oPreviousCell=myCell; } } ฟังก์ชั่น CalendarCellsMsOut (oInstance) ////// Cell MouseOut { var myCell myCell=event.srcElement; CalendarCellSetCss(0,myCell); } ฟังก์ชั่น CalendarCellsClick(oCell,oInstance) { var sDay,sMonth,sYear,newDate sYear=oInstance.currDate.getFullYear(); sMonth=oInstance.currDate.getMonth(); sDay=oInstance.currDate.getDate(); if(oCell.innerText!=" ") { sDay=parseInt(oCell.innerText); if(sDay!=oInstance.currDate.getDate()) { newDate=new Date(sYear,sMonth,sDay); oInstance.Refresh (วันใหม่); } } sDateString=sYear+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"; } ฟังก์ชั่น CalendarYearChange(oInstance) /// เปลี่ยนปี { var sDay,sMonth,sYear,newDate sDay=oInstance.currDate.getDate(); sMonth=oInstance.currDate.getMonth(); sYear=document.all[oInstance.sYEARID].value newDate=new Date(sYear,sMonth,sDay); oInstance.Refresh (วันใหม่); } ฟังก์ชัน CalendarMonthChange(oInstance) /// การเปลี่ยนแปลงเดือน { var sDay,sMonth,sYear,newDate sDay=oInstance.currDate.getDate(); sMonth=document.all[oInstance.sMONTHID].value sYear=oInstance.currDate.getYear(); newDate=วันที่ใหม่(sYear,sMonth,sDay); oInstance.Refresh (วันใหม่); } ฟังก์ชั่น CalendarTodayClick(oInstance) /// ปุ่ม "วันนี้" เปลี่ยน { oInstance.Refresh(new Date()); } ฟังก์ชั่น 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"; } } ฟังก์ชั่น CalendarCellSetCss(sMode,oCell) /// ตั้งค่า Cell Css { // sMode // 0: OnMouserOut 1: OnMouseOver if(sMode) { oCell.style.border="1px solid #5589AA"; oCell.style.พื้นหลังสี="#BCD0DE"; } อื่น { oCell.style.border="1px ทึบ #FFFFFF"; oCell.style.พื้นหลังสี="#FFFFFF"; } } ฟังก์ชั่น CalendarGetMaxDay(nowYear,nowMonth) /// รับ MaxDay ของเดือนปัจจุบัน { var nextMonth,nextYear,currDate,nextDate,theMaxDay nextMonth=nowMonth+1; ถ้า (เดือนหน้า>11) { ปีถัดไป=ตอนนี้ปี+1; เดือนถัดไป=0; } อื่น ๆ { ปีหน้า=ตอนนี้ปี; } currDate=วันที่ใหม่(ตอนนี้ปี,ตอนนี้เดือน,1); nextDate=วันใหม่(ปีถัดไป,เดือนถัดไป,1); theMaxDay=(วันถัดไป-currDate)/(24*60*60*1000); กลับ MaxDay; } ฟังก์ชั่น CalendargetPos(el,ePro) /// รับตำแหน่งที่แน่นอน { var ePos=0; ในขณะที่(el!=null) { ePos+=el["offset"+ePro]; el=el.offsetParent; } ส่งคืน ePos; } ฟังก์ชั่น CalendarDblNum(num) { if(num<10) return "0"+num; มิฉะนั้นจะส่งคืน num; } ฟังก์ชั่น CalendarCancel(oInstance) ///Cancel { CalendarDiv=document.all[oInstance.sDIVID]; CalendarDiv.style.display="none"; } </script> </head> <BODY > <script > var oCalendarEn=new PopupCalendar("oCalendarEn"); //初始化控件时,请给出实例名称如:oCalendarEn oCalendarEn.Init(); var oCalendarChs=ป๊อปอัพปฏิทินใหม่("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="中文界的版"> < /ร่างกาย> </HTML>
