Tip: you can modify some code before running
Javascript date selector code<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.111cn.net/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>Javascript date selector code</title><script language="javascript">Var months = new Array ", "August", "August", "August"); var days = new Array (, 30, 31, 30, 31 ); var weeks = new Array ("day", "one", "two", "three", "four", "five", "six"); var today; var pX; var pY; document. writeln ("<div id='Calendar' ></div>"); Function getDays (month, year) {if (1 = month) {return (0 = year % 4) & (0! = (Year % 100) | (0 = year % 400 )? 29: 28;} else {return days [month];} function getToday () {var date = new Date (); this. year = date. getFullYear (); this. month = date. getMonth (); this. day = date. getDate ();} function getSelectDay (str) {var str = str. split ("-"); var date = new Date (parseFloat (str [0]), parseFloat (str [1])-1, parseFloat (str [2]); this. year = date. getFullYear (); this. month = date. getMonth (); this. day = date. getDate ();} function S HowDays () {var obj_Year = get_object ('year'); var obj_Month = get_object ('month'); var parseYear = parseInt (obj_Year.options [obj_Year.selectedIndex]. value); var Seldate = new Date (parseYear, obj_Month.selectedIndex, 1); var day =-1; var startDay = Seldate. getDay (); var daily = 0; if (today. year = Seldate. getFullYear () & (today. month = Seldate. getMonth () {day = today. day;} var tableDay = get_objec T ('day'); var DaysNum = getDays (Seldate. getMonth (), Seldate. getFullYear (); for (var intWeek = 1; intWeek <tableDay. rows. length; intWeek ++) {for (var intDay = 0; intDay <tableDay. rows [intWeek]. cells. length; intDay ++) {var cell = tableDay. rows [intWeek]. cells [intDay]; if (intDay = startDay) & (0 = daily) {daily = 1 ;}if (day = daily) {cell. style. background = '# 6699CC'; cell. style. color = '# ffff';} els E if (intDay = 6) {cell. style. color = 'green';} else if (intDay = 0) {cell. style. color = 'red';} if (daily> 0) & (daily <= DaysNum) {cell. innerHTML = daily; daily ++;} else{cell.style.css Text = ''; cell. innerHTML = '';}}} function GetDate (idname, e) {var sDate; var getElement = is_gecko? E.tar get: event. srcElement; if (getElement. tagName = "TD") {if (getElement. innerHTML! = "") {SDate = get_object ('year '). value + "-" + get_object ('month '). value + "-" + getElement. innerHTML; get_object (idname ). value = sDate; HiddenCalendar () ;}} function HiddenCalendar () {get_object ('Calendar '). style. visibility = 'den den ';} function ShowCalendar (idname) {var x, y, I, intWeeks, intDays; var table; var year, month, day; var obj = get_object (idname); var thisyear; thisyear = new Date (); thisyear = thisyear. getFullYear (); today = obj. value; if (isDate (today) {today = new getSelectDay (today);} else {today = new getToday ();} x = obj. offsetLeft; y = obj. offsetTop; while (obj = obj. offsetParent) {x + = obj. offsetLeft; y + = obj. offsetTop;} var Cal = get_object ('Calendar '); Cal. style. left = x + 2 + 'px '; Cal. style. top = y + 20 + 'px '; Cal. style. visibility = "visible"; table ="<table border='0' cellspacing='0' >"; Table + ="<tr>"; Table + ="<td >"; Table + ="<select name='Year' id='Year' onChange='ShowDays()' >"; For (I = thisyear-35; I <(thisyear + 5); I ++) {table + ="<option value=" + i + " " + (today.year == i ? "Selected" : "") + ">"+ I +"</option>";} Table + ="</select>"; Table + ="<select name='Month' id='Month' onChange='ShowDays()' >"; For (I = 0; I <months. length; I ++) {table + ="<option value= " + (i + 1) + " " + (today.month == i ? "Selected" : "") + ">"+ Months [I] +"</option>";} Table + ="</select>"; Table + ="</td>"; Table + ="<td align='center' title='关闭' onClick='javascript:HiddenCalendar()'>S</td>"; Table + ="</tr>"; Table + ="<tr><td align='center' colspan='2'>"; Table + ="<table id='Day' border='0' width='100%'>"; Table + ="<tr>"; For (I = 0; I <weeks. length; I ++) {table + ="<td align='center' >"+ Weeks [I] +"</td>";} Table + ="</tr>"; For (intWeeks = 0; intWeeks <6; intWeeks ++) {table + ="<tr>"; For (intDays = 0; intDays <weeks. length; intDays ++) {table + ="<td onClick='GetDate("" + idname + "",event)' align='center'></td>";} Table + ="</tr>";} Table + ="</table></td></tr></table>"; Cal. innerHTML = table; ShowDays ();} function isDate (dateStr) {var datePat =/^ (d {4}) (-) (d {1, 2 })(-) (d {1, 2}) $/; var matchArray = dateStr. match (datePat); if (matchArray = null) return false; var month = matchArray [3]; var day = matchArray [5]; var year = matchArray [1]; if (month <1 | month> 12) return false; if (day <1 | day> 31) return false; if (month = 4 | month = 6 | month = 9 | month = 11) & Day = 31) return false; if (month = 2) {var isleap = (year % 4 = 0 & (year % 100! = 0 | year % 400 = 0); if (day> 29 | (day = 29 &&! Isleap) return false;} return true;} function get_object (idname) {if (document. getElementById) {return document. getElementById (idname);} else if (document. all) {return document. all [idname];} else if (document. layers) {return document. layers [idname];} else {return null ;}}</script></head><body><form id="form1" name="form1" method="post" action=""> <label> <input name="datav" type="text" id="datav" onclick="ShowCalendar('datav');" /> </label></form></body></html>
Tip: you can modify some code before running
