年月日三级联动
首先我们要做三个下拉框 就要用到<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>