年月日三级联动菜单

最新推荐文章于 2018-07-21 19:17:00 发布

子固1024

最新推荐文章于 2018-07-21 19:17:00 发布

阅读量716

点赞数

分类专栏： js 文章标签： ajax 三级联动菜单

本文链接：https://blog.youkuaiyun.com/qq_16717565/article/details/40110349

版权

js 专栏收录该内容

4 篇文章

订阅专栏

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">

<title>My JSP 'Test.jsp' starting page</title>

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">

<script type="text/javascript">
function years(obj, Cyear) {
var len = 2; // select长度,即option数量
var selObj = document.getElementById(obj);
var newOpt; // OPTION对象
// 循环添加OPION元素到年份select对象中
for (var i = 0; i < len; i++) {
if (selObj.options.length != len) { // 如果目标对象下拉框升度不等于设定的长度则执行以下代码
newOpt = window.document.createElement("OPTION"); // 新建一个OPTION对象
newOpt.text = Cyear - i; // 设置OPTION对象的内容
newOpt.value = Cyear - i; // 设置OPTION对象的值
selObj.options.add(newOpt, i); // 添加到目标对象中
}
}
}
var currentMoth;
var currentYear;
//获取当前年月日
var myDate = new Date();
function months() {
var max;
var month = document.getElementById("month");
month.length = 0;
currentMoth = myDate.getMonth() + 1;
currentYear = myDate.getFullYear();
var year = document.getElementById("year");
var vYear = parseInt(year.value);
//判断如果是本年份的话，则月份只显示到本月份
if (vYear == currentYear) {
max = currentMoth;
} else {
max = 12;
}
for (var i = max; i >= 1; i--) {
//new Option(i,i),第一个i表示的是文本内容，第二个i是value
month.options.add(new Option(i, i));
}

}

function change_date() {
// var birthday = document.birthday;
var currentYear = myDate.getFullYear();
var year = document.getElementById("year");
var month = document.getElementById("month");
var day = document.getElementById("date");
var vYear = parseInt(year.value);
var vMonth = parseInt(month.value);
// 根据年月获取天数
var max;
day.options.length = 0;
if (vMonth == currentMoth && vYear == currentYear) {
max = myDate.getDate();
} else {
//能获得vYear年vMonth月有多少天
max = (new Date(vYear, vMonth, 0)).getDate();
}

for (var i = max; i >= 1; i--) {
day.options.add(new Option(i, i));
}
}
</script>
</head>

<body οnlοad="years('year',new Date().getFullYear()),months(),change_date()">
<table>
<tr>
<td><select size="1" class="timedate" name="year" id="year"
style="width:150px" οnchange="change_date()"></select> 年</td>
<td><select size="1" class="timedate" name="month" id="month"
style="width:70px" οnfοcus="months(),change_date()"
οnchange="change_date()"></select> 月    
<select size="1" class="timedate" name="day" id="date" style="width:50px">
</select>
日</td>
</tr>
</table>
</body>
</html>