【转】JS 下拉列表式时间空间
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>日期联动选择器</title><script type="text/javascript">var $ = function (id) {return "string" == typeof id ? document.getElementById(id) : id;};function addEventHandler(oTarget, sEventType, fnHandler) {if (oTarget.addEventListener) { oTarget.addEventListener(sEventType, fnHandler, false);} else if (oTarget.attachEvent) { oTarget.attachEvent("on" + sEventType, fnHandler);} else { oTarget["on" + sEventType] = fnHandler;}};var Class = {create: function() {return function() { this.initialize.apply(this, arguments);}}}var Extend = function(destination, source) {for (var property in source) { destination[property] = source[property];}return destination;}var DateSelector = Class.create();DateSelector.prototype = {initialize: function(oYear, oMonth, oDay, options) {this.SelYear = $(oYear);//年选择对象this.SelMonth = $(oMonth);//月选择对象this.SelDay = $(oDay);//日选择对象this.SetOptions(options);var dt = new Date(), iMonth = parseInt(this.options.Month), iDay = parseInt(this.options.Day), iMinYear = parseInt(this.options.MinYear), iMaxYear = parseInt(this.options.MaxYear);this.Year = parseInt(this.options.Year) || dt.getFullYear();this.Month = 1 <= iMonth && iMonth <= 12 ? iMonth : dt.getMonth() + 1;this.Day = iDay > 0 ? iDay : dt.getDate();this.MinYear = iMinYear && iMinYear < this.Year ? iMinYear : this.Year;this.MaxYear = iMaxYear && iMaxYear > this.Year ? iMaxYear : this.Year;this.onChange = this.options.onChange;//年设置this.SetSelect(this.SelYear, this.MinYear, this.MaxYear - this.MinYear + 1, this.Year - this.MinYear);//月设置this.SetSelect(this.SelMonth, 1, 12, this.Month - 1);//日设置this.SetDay();var oThis = this;//日期改变事件addEventHandler(this.SelYear, "change", function(){ oThis.Year = oThis.SelYear.value; oThis.SetDay(); oThis.onChange();});addEventHandler(this.SelMonth, "change", function(){ oThis.Month = oThis.SelMonth.value; oThis.SetDay(); oThis.onChange();});addEventHandler(this.SelDay, "change", function(){ oThis.Day = oThis.SelDay.value; oThis.onChange(); });},//设置默认属性SetOptions: function(options) {this.options = {//默认值 Year: 0,//年 Month: 0,//月 Day: 0,//日 MinYear: 0,//最小年份 MaxYear: 0,//最大年份 onChange: function(){}//日期改变时执行};Extend(this.options, options || {});},//日设置SetDay: function() {//取得月份天数var daysInMonth = new Date(this.Year, this.Month, 0).getDate();if (this.Day > daysInMonth) { this.Day = daysInMonth; };this.SetSelect(this.SelDay, 1, daysInMonth, this.Day - 1);},//select设置SetSelect: function(oSelect, iStart, iLength, iIndex) {//添加optionoSelect.options.length = iLength;for (var i = 0; i < iLength; i++) { oSelect.options[i].text = oSelect.options[i].value = iStart + i; }//设置选中项oSelect.selectedIndex = iIndex;}};</script></head><body><select id="idYear"></select> <select id="idMonth"></select> <select id="idDay"></select> <br />你选择的日期：<span id="idShow"></span><script>var ds = new DateSelector("idYear", "idMonth", "idDay", {MaxYear: new Date().getFullYear() + 2,onChange: function(){ $("idShow").innerHTML = this.Year + "/" + this.Month + "/" + this.Day; }});ds.onChange();</script></body></html>?