JavaScript年月日三级联动

最新推荐文章于 2021-06-16 09:21:04 发布

小李讲源码

最新推荐文章于 2021-06-16 09:21:04 发布

阅读量1k

点赞数 1

分类专栏： JavaScript

本文链接：https://blog.csdn.net/ncut_LJD/article/details/50893551

版权

JavaScript 专栏收录该内容

16 篇文章 0 订阅

订阅专栏

年月日三级联动

首先我们要做三个下拉框就要用到<select>

然后这回我们不用<option>在一个一个写非常的麻烦

我们要在js中创建new Option()对象通过x.options.add(new Option(text,value)) 增加option 这里的x是我们获取的id名称x= document.getElementById("。。。");

然后月和年是一样的

我们日是根据年和月来定的比如一月是31天闰年2月29天通过年和月就知道这个月有多少天

onclick 单击事件，比如你点击一button，就会触发 onclick事件
onchange内容与上一次发生改变时就会触发该事件，比如文本框内容

好了下面是代码

<!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=utf-8" />
<script type="text/javascript">
function init()
{
	var year=document.getElementById("year");
	year.options.add(new Option("-年-",0));
	for(var i=1990; i<=2100; i++)
	{
		year.options.add(new Option(i,i));
	}
	var month=document.getElementById("month");
	month.options.add(new Option("-月-",0));
	for(var i=1; i<=12; i++)
	{
		month.options.add(new Option(i,i));
	}

}
function getday()
{
	var year=document.getElementById("year").value;
	var month=document.getElementById("month").value;
	var day=document.getElementById("day");
	var days=new Array(31,28,31,30,31,30,31,31,30,31,30,31);
	if (((year % 4)==0) && ((year % 100)!=0) || ((year % 400)==0)) 
	{
		if(month==2)
		{
			days[month-1]++;
		}
	}
	for(var i=1; i<=days[month-1]; i++)
	{
		day.options.add(new Option(i,i));
	}

}
function show()
{
	var year=document.getElementById("year").value;
	var month=document.getElementById("month").value;
	var day=document.getElementById("day").value;
	alert(year+"/"+month+"/"+day);

}
</script>
<style type="text/css">
</style>
</head>

<body οnlοad="init();">
<select id="year" οnchange="getday();">
</select>年
<select id="month" οnchange="getday();">
</select>月
<select id="day" οnchange="show();">
</select>日
</body>
</html>

小李讲源码

关注

1
点赞
踩
5

收藏

觉得还不错? 一键收藏
0
评论
JavaScript年月日三级联动

年月日三级联动首先我们要做三个下拉框就要用到然后这回我们不用在一个一个写非常的麻烦我们要在js中创建new Option()对象通过x.options.add(new Option(text,value)) 增加option 这里的x是我们获取的id名称x= document.getElementById("。。。");然后月和年是一样的我们日是根据年和月来定的比如一
复制链接

扫一扫

专栏目录