关于时间的操作（JavaScript版）——年月日三级级联（默认依次显示请选择年、请选择月和请选择日）
这篇博客和前一篇博客基本同样，仅仅是显示的默认值不同：
<!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版）——年月日三级级联（默认依次显示请选择年、请选择月和请选择日）的更多相关文章
- 时间操作（JavaScript版）—年月日三级联动（默认显示系统时间）
版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/wangshuxuncom/article/details/35263317 这个功能 ...
- JavaScript显示当前时间的操作
JavaScript一种直译式脚本语言,是一种动态类型.弱类型.基于原型的语言,内置支持类型.它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标 ...
- JS实现年月日三级联动+省市区三级联动+国家省市三级联动
开篇随笔:最近项目需要用到关于年月日三级联动以及省市区三级联动下拉选择的功能,于是乎网上搜了一些做法,觉得有一些只是给出了小的案例或者只有单纯的js还不完整,却很难找到详细的具体数据(baidu搜索都 ...
- 解析Linux内核的基本的模块管理与时间管理操作---超时处理【转】
转自:http://www.jb51.net/article/79960.htm 这篇文章主要介绍了Linux内核的基本的模块管理与时间管理操作,包括模块加载卸载函数的使用和定时器的用法等知识,需要的 ...
- JavaScript版拼图小游戏
慕课网上准备开个新的jQuery教程,花了3天空闲时间写了一个Javascript版的拼图小游戏,作为新教程配套的分析案例 拼图游戏网上有不少的实现案例了,但是此源码是我自己的实现,所以不做太多的比较 ...
- 利用select实现年月日三级联动的日期选择效果
× 目录 [1]演示 [2]规划 [3]结构生成[4]算法处理 前面的话 关于select控件,可能年月日三级联动的日期选择效果是最常见的应用了.本文是选择框脚本的实践,下面将对日期选择效果进行详细介 ...
- javascript日历控件——纯javascript版
平时只有下班时间能code,闲来写了个纯javascript版.引用该calendar.js文件,然后给要设置成日历控件的input的id设置成calendar,该input就会变成日历控件. < ...
- JS年月日三级联动下拉框日期选择代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- JS 实现的年月日三级联动
js文件 SYT="-请选择年份-"; SMT="-请选择月份-"; SDT="-请选择日期-"; BYN=50;//年份范围往前50年 A ...
随机推荐
- CAsyncSocket
本词条缺少名片图,补充相关内容使词条更完整,还能快速升级,赶紧来编辑吧! 它是一个异步非阻塞Socket封装类,CAsyncSocket::Create()有一个参数指明了你想要处理哪些Socket事 ...
- Qt Creator实现状态栏显示
在程序主窗口Mainwindow中,有菜单栏,工具栏,中心部件和状态栏.前面几个已经讲过了,这次讲解状态栏的使用. 程序中有哪些不明白的类或函数,请自己查看帮助. 1.我们在mainwindow.h中 ...
- vs2013+EF6+Mysql
1.首先需要在整个项目中添加一个Model类库,在类库中引用EF 我需要在该项目下添加EF的MYSQL对象实体 首先需要引入几个相关引用,我通过NuGet来添加,如下图 接下来我需要通过ADO.NET ...
- innodb部分参数优化
参数调优内容:1. 内存利用方面2. 日值控制方面3. 文件IO分配,空间占用方面4. 其它相关参数 1.内存利用方面:首先介绍一个Innodb最重要的参数:innodb_buffer_pool_si ...
- Objective-C中的copy协议
NSObject对象是否可以copy自己 NSObject类没有实现NSCopying或者NSMutableCopying协议,但是却有copy以及mutableCopy实例方法.然而,如果用NSOb ...
- 自适应 or 移动前端页面布局的问题？
说出来,还请各位看官不要笑 - -.哥们至今不是很清楚页面的自适应和移动前端页面开发有什么区别 .有幸哪位看官清楚这些的话,希望能不吝赐教 .A.meta <meta name=& ...
- virtual pc中添加软盘支持
最近对操作系统挺有兴趣的,实验了一下!准备找一个虚拟机,之前在xp上使用virtual pc感觉不错,准备在本机上装一下,但是发现居然不支持软盘了! 查阅了各种资料,终于找到了解决的办法. 1. 下载 ...
- pyqt5和qt-designer结合
在ubuntu中我们安装了python3-pyqt5这个包后就可以用pyqt5编程了,但是只能用纯代码写窗体,很麻烦.我们要用qt-designer来设计窗体. 我们通过新立得安装qt4-design ...
- C#文本文件导入数据库
using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Windo ...
- c++中的迭代器 iterator
迭代器iterator的作用类似于指针. iterator只有针对制定<类型>的容器才有效.例如: vector<int> vec; vector<int>::it ...