这篇博客和前一篇博客基本同样，仅仅是显示的默认值不同：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>

	<head>

		<title>年月日三级级联（默认依次显示请选择年、请选择月和请选择日）</title>

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

		<script type="text/javascript">

			function removeChilds(id){

				var childs = document.getElementById(id).childNodes;//这一行代码和紧跟的以下的for循环用于清除原来日的下拉列表的select中的对节点

				for(var i=childs.length-1;i>=0;i--) {

					document.getElementById(id).removeChild(childs[i]);

				}

			}

			function setDay(){

				var yearToDate=document.getElementById("year").value;

				var monthToDate=document.getElementById("month").value;

				//alert(yearToDate+":"+monthToDate);

				var days=new Array(28,29,30,31);

				if(yearToDate==0||monthToDate==0){//假设是当前系统时间则设置默认的日

					var newOption = document.createElement("option");newOption.setAttribute("value",0);newOption.setAttribute("selected","selected");

					var textToNewOption=document.createTextNode("请选择日");newOption.appendChild(textToNewOption);

					document.getElementById("day").appendChild(newOption);

				}else{

					if(monthToDate==1||monthToDate==3||monthToDate==5||monthToDate==7||monthToDate==8||monthToDate==10||monthToDate==12){

						removeChilds("day");

						for( i=1; i<=days[3]; i++ ){

							var newOption = document.createElement("option");newOption.setAttribute("value",i);

							var textToNewOption=document.createTextNode(i);newOption.appendChild(textToNewOption);

							document.getElementById("day").appendChild(newOption);

						}

					}

					if(monthToDate==4||monthToDate==6||monthToDate==9||monthToDate==11){

						removeChilds("day");

						for( i=1; i<=days[2]; i++ ){

							var newOption = document.createElement("option");newOption.setAttribute("value",i);

							var textToNewOption=document.createTextNode(i);newOption.appendChild(textToNewOption);

							document.getElementById("day").appendChild(newOption);

						}

					}

					if(monthToDate==2){

						removeChilds("day");

						if(yearToDate%400==0||yearToDate%100!=0&&yearToDate%4==0){//闰年

							for( i=1; i<=days[1]; i++ ){

								var newOption = document.createElement("option");newOption.setAttribute("value",i);

								var textToNewOption=document.createTextNode(i);newOption.appendChild(textToNewOption);

								document.getElementById("day").appendChild(newOption);

							}

						}else{

							for( i=1; i<=days[0]; i++ ){

								var newOption = document.createElement("option");newOption.setAttribute("value",i);

								var textToNewOption=document.createTextNode(i);newOption.appendChild(textToNewOption);

								document.getElementById("day").appendChild(newOption);

							}

						}

					}

				}

			}

			function getMonth(){

				var m;

				document.write("<option value=0 selected=\"selected\">请选择月</option>");

				for(m=1;m<=12;m++) {

					document.write("<option value="+m+">"+m+"</option>");

				}

			}

			function getYear(){

				var y;

				var date=new Date();

				var fullYear=date.getFullYear();

				document.write("<option value=0 selected=\"selected\">请选择年</option>");

				for(y=fullYear-60;y<=fullYear;y++){

					document.write("<option value="+y+" >"+y+"</option>");

				}

			}

			function checkDay(){

				var yearToDate=document.getElementById("year").value;

				var monthToDate=document.getElementById("month").value;

				if(yearToDate==0||monthToDate==0){

					alert("请先选择年和日");

				}

			}

		</script>

	</head>

	<body>

		<select name="year" id="year" onChange="setDay();"><script type="text/javascript">getYear();</script></select>年

		<select name="month" id="month" onChange="setDay()"><script type="text/javascript">getMonth();</script></select>月

		<select name="day" id="day" onclick="checkDay()"></select>日<script type="text/javascript">setDay();<!--起到初始化日的作用。--></script>

	</body>

</html>

关于时间的操作（JavaScript版）——年月日三级级联（默认依次显示请选择年、请选择月和请选择日）的更多相关文章

  1. 时间操作（JavaScript版）—年月日三级联动（默认显示系统时间）

    版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/wangshuxuncom/article/details/35263317         这个功能 ...

  2. JavaScript显示当前时间的操作

    JavaScript一种直译式脚本语言,是一种动态类型.弱类型.基于原型的语言,内置支持类型.它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标 ...

  3. JS实现年月日三级联动+省市区三级联动+国家省市三级联动

    开篇随笔:最近项目需要用到关于年月日三级联动以及省市区三级联动下拉选择的功能,于是乎网上搜了一些做法,觉得有一些只是给出了小的案例或者只有单纯的js还不完整,却很难找到详细的具体数据(baidu搜索都 ...

  4. 解析Linux内核的基本的模块管理与时间管理操作---超时处理【转】

    转自:http://www.jb51.net/article/79960.htm 这篇文章主要介绍了Linux内核的基本的模块管理与时间管理操作,包括模块加载卸载函数的使用和定时器的用法等知识,需要的 ...

  5. JavaScript版拼图小游戏

    慕课网上准备开个新的jQuery教程,花了3天空闲时间写了一个Javascript版的拼图小游戏,作为新教程配套的分析案例 拼图游戏网上有不少的实现案例了,但是此源码是我自己的实现,所以不做太多的比较 ...

  6. 利用select实现年月日三级联动的日期选择效果

    × 目录 [1]演示 [2]规划 [3]结构生成[4]算法处理 前面的话 关于select控件,可能年月日三级联动的日期选择效果是最常见的应用了.本文是选择框脚本的实践,下面将对日期选择效果进行详细介 ...

  7. javascript日历控件——纯javascript版

    平时只有下班时间能code,闲来写了个纯javascript版.引用该calendar.js文件,然后给要设置成日历控件的input的id设置成calendar,该input就会变成日历控件. < ...

  8. JS年月日三级联动下拉框日期选择代码

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. JS 实现的年月日三级联动

    js文件 SYT="-请选择年份-"; SMT="-请选择月份-"; SDT="-请选择日期-"; BYN=50;//年份范围往前50年 A ...

随机推荐

  1. Java学习笔记——JDBC读取properties属性文件

    Java 中的 properties 文件是一种配置文件,主要用于表达配置信息,文件类型为*.properties,格式为文本文件. 文件的内容是格式是"键=值"(key-valu ...

  2. Nginx 主配置文件参数详解

    Nginx 主配置文件参数详解 Nginx 安装完毕后,会有响应的安装目录,安装目录里 nginx.conf 为 nginx 的主配置文件, ginx 主配置文件分为 4 部分,main(全局配置). ...

  3. HID 报告描述符精细说明.

    1,报告描述符概述    1.1) 报表描述符        报表描述符和USB的其他描述符是不一样的,它不是一个简单的表格,报表描述符是USB所有描述符中最复杂的.报表描述符非常复杂而有弹性,因为它 ...

  4. Facebook Architecture

    Facebook Architecture Quora article a relatively old presentation on facebook architecture another I ...

  5. mybatis之特殊查询

    在mybatis查询的过程中,某个字段是经过计算得到的,这时,在设计数据表的时候,就不 必在增加此对应的字段 那么,在查询的时候,页面有需要展示这个字段时,怎么办呢? 举个例子: 在查询微信团商品时, ...

  6. 使用VS Code开发Angular 2应用程序所需配置文件的解析

    目录 package.json typings.json tsconfig.json launch.json settings.json tasks.json package.json: 这是项目的基 ...

  7. java下管道流 PipedOutputStream 与PipedInputStream

    package cn.stat.p2.demo; import java.io.IOException; import java.io.PipedInputStream; import java.io ...

  8. Kali Linux 常见问题解答

    更新Kali apt源 vim /etc/apt/sources.list #开始 deb http://http.kali.org/kali kali-rolling main non-free c ...

  9. 练习使用css3实现3d按钮

    网上有很多漂亮的用css3实现的3d按钮,如'这个'.‘糖果色按钮’, 今天练习了一下,喏,下面这样,兼容性不好. 小黑子小虎子 3d效果和发光效果都是利用box-shadow,也经常利用伪元素:af ...

  10. 将含有父ID的列表转成树

    我们知道数据库一般是以一个列表(id,pid)的形式保存树的.如何提取这棵树呢?最简单的方法就是根据pid循环查表.但是毫无疑问,这会产生巨大的数据库查询开销. 那么一般建议的方法是一次性将全部相关数 ...