[转]简易下拉框式日期选择器(带闰平年判断)-白红宇

[转]简易下拉框式日期选择器(带闰平年判断)

阅读量：5338 次

发布时间：2019-06-15

本文共 4322 字，大约阅读时间需要 14 分钟。

<html>

<head>

<title>日期选择类下拉框</title>

<meta http-equiv="content-type" content="text/html; charset=GBK">

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js" charset="GBK"></script>

</head>

<body>

<form name="form">

<input type="text" id="time_show"><br>

<select id="time_year" onChange="javascript:YearDay(this.value);"></select>

<select id="time_month" onChange="javascript:MonthDay(this.value);"></select>

<select id="time_day" onChange="javascript:setTimeShow();"></select>

<select id="time_hour" onChange="javascript:setTimeShow();"></select>

<select id="time_minute" onChange="javascript:setTimeShow();"></select>

<select id="time_second" onChange="javascript:setTimeShow();"></select>

</form>

<script type="text/javascript">

var TimeShow = $("#time_show");

var TimeYear = $("#time_year");

var TimeMonth = $("#time_month");

var TimeDay = $("#time_day");

var TimeHour = $("#time_hour");

var TimeMinute = $("#time_minute");

var TimeSecond = $("#time_second");

/*默认值*/

var Year = "";

var Month = "";

var Day = "";

var Hour = "";

var Minute = "";

var Second = "";

/*赋值格式*/

function setTimeShow(){

var time = TimeYear.val()+"-"+TimeMonth.val()+"-"+TimeDay.val()+" "+TimeHour.val()+":"+TimeMinute.val()+":"+TimeSecond.val();

TimeShow.attr("value",time);

}

//以下内容可单独保存调用

/***************

* @ Name 日期选择类下拉框式

* @ Version 1.0

* @ Writer JSPGen

* @ Time 2008年06月

* @ Address www.jspgen.com

* @ E-mail:jspgen@163.com QQ 190582560

***************/

var NowTime = new Date();

if(Year == "") { Year = NowTime.getFullYear(); }

if(Month == "") { Month = NowTime.getMonth()+1; }

if(Day == "") { Day = NowTime.getDate(); }

if(Hour == "") { Hour = NowTime.getHours(); }

if(Minute == "") { Minute = NowTime.getMinutes(); }

if(Second == "") { Second = NowTime.getSeconds(); }

var MonthHead = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];

var DayMax = MonthHead[Month-1];

/*写年*/

for (var i=Year; i <(Year+3); i++){

if(i == Year){

TimeYear.append("<option value=\"" +i+ "\" selected >" +i+ "年</option>");

}else{

TimeYear.append("<option value=\"" +i+ "\">" +i+ "年</option>");

}

}

/*写月*/

for (var i = 1; i < 13; i++) {

var m = i>9 ? i : "0"+i;

if(m == Month){

TimeMonth.append("<option value=\"" +m+ "\" selected >" +m+ "月</option>");

}else{

TimeMonth.append("<option value=\"" +m+ "\">" +m+ "月</option>");

}

}

/*写日*/

if(Month==2 && isPinYear(Year)){DayMax++;} setTimeDay(DayMax);

/*写时*/

for (var i = 0; i < 24; i++) {

var v = i>9 ? i : "0"+i;

if(v == Hour){

TimeHour.append("<option value=\"" +v+ "\" selected >" +v+ "时</option>");

}else{

TimeHour.append("<option value=\"" +v+ "\">" +v+ "时</option>");

}

}

/*写分*/

for (var i = 0; i < 60; i++) {

var v = i>9 ? i : "0"+i;

if(v == Minute){

TimeMinute.append("<option value=\"" +v+ "\" selected >" +v+ "分</option>");

}else{

TimeMinute.append("<option value=\"" +v+ "\">" +v+ "分</option>");

}

}

/*写秒*/

for (var i = 0; i < 60; i++) {

var v = i>9 ? i : "0"+i;

if(v == Second){

TimeSecond.append("<option value=\"" +v+ "\" selected >" +v+ "秒</option>");

}else{

TimeSecond.append("<option value=\"" +v+ "\">" +v+ "秒</option>");

}

}

setTimeShow();

/*年发生变化时日期发生变化(主要是判断闰平年)*/

function YearDay(value){

var mvalue = TimeMonth.val();

if (mvalue == "") { optionsClear(TimeDay); return; }

var dvalue = MonthHead[mvalue-1];

if (mvalue == 2 && isPinYear(value)) dvalue++;

setTimeDay(dvalue);

}

/*月发生变化时日期联动*/

function MonthDay(value) {

var yvalue = TimeYear.val();

if (yvalue == "") { optionsClear(TimeDay); return; }

var dvalue = MonthHead[value-1];

if (value == 2 && isPinYear(yvalue)) dvalue++;

setTimeDay(dvalue);

}

/*据条件写日期*/

function setTimeDay(dvalue){

optionsClear(TimeDay);

for (var i=1; i<(dvalue+1); i++){

var d = i>9 ? i : "0"+i;

if(d == Day){

TimeDay.append("<option value=\"" +d+ "\" selected >" +d+ "日</option>");

}else{

TimeDay.append("<option value=\"" +d+ "\">" +d+ "日</option>");

}

}

setTimeShow();

}

//赋值

function setTimeShow(){

var time = TimeYear.val()+"-"+TimeMonth.val()+"-"+TimeDay.val()+" "+TimeHour.val()+":"+TimeMinute.val()+":"+TimeSecond.val();

TimeShow.attr("value",time);

}

/*判断是否闰平年*/

function isPinYear(year){

return (0 == year%4 && (year%100 != 0 || year%400 == 0));

}

/*清空下拉列表*/

function optionsClear(o){o.empty();}

</script>

</body>

</html>

来源：

转载于:https://www.cnblogs.com/ggbbeyou/archive/2011/12/31/2308346.html

你可能感兴趣的文章

Linux下安装配置MediaWiKi全过程

查看>>

【转】使用maven 如何生成源代码的jar包

.net控制台程序Program args参数解析

2012-7-29Joomla自带的文章模块+K2文章模块+ZT文章模块

查看>>

bzoj1018[SHOI2008]堵塞的交通traffic

查看>>

day22_1-课前上节复习+os模块

查看>>

python （五）小数据池、集合、copy、文件操作

查看>>

Nginx rewrite URL examples with and without redirect address