溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章將為大家詳細講解有關基于JavaScript如何實現(xiàn)年月日三級聯(lián)動菜單，小編覺得挺實用的，因此分享給大家做個參考，希望大家閱讀完這篇文章后可以有所收獲。
具體內(nèi)容如下
代碼：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>年月日三級聯(lián)動</title>
</head>
<body onload="initYear(),initMonth()">
<select id="year"></select>年
<select id="month" onchange="initDate()"></select>月
<select id="date"></select>日
<script>
/**
* 初始化年
*/
function initYear() {
//獲得當前年份
let curYear = new Date().getFullYear();
//獲得年列表對象
let yearObj = document.getElementById("year");
yearObj.options.add(new Option("---請選擇年---", ""));
for (let year = curYear; year > curYear - 100; year--) {
let option = new Option(year, year);
yearObj.options.add(option);
}
}
/**
* 初始化月份
*/
function initMonth() {
//獲得年列表對象
let monthObj = document.getElementById("month");
monthObj.options.add(new Option("---請選擇月份---", ""));
for (let month = 1; month <= 12; month++) {
let option = new Option(month, month);
monthObj.options.add(option);
}
}
/**
* 初始化日
*/
function initDate() {
let dateObj = document.getElementById("date");
//獲得當月選中月份
let month = document.getElementById("month").value;
//當月份選擇完畢，再彈出對應日期
dateObj.options.add(new Option("---請選擇日期---", ""));
//將month轉(zhuǎn)化成數(shù)字
month = parseInt(month);
//定義每月的天數(shù)
let days = 31;
switch (month) {
case 1:
case 3:
case 5:
case 7:
case 8:
case 10:
case 12:
break;
case 4:
case 6:
case 9:
case 11:
days = 30;
break;
case 2:
//需要判斷是否為閏年，獲得當前選中的年
let year = document.getElementById("year").value;
if (year % 4 == 0 && year % 100 != 0 || year % 400 == 0) {
days = 29;
} else {
days = 28;
}
break;
}
//將得到的天數(shù)，循環(huán)輸出
for (let i = 1; i <= days; i++) {
let option = new Option(i, i);
dateObj.options.add(option);
}
}
</script>
</body>
</html>關于“基于JavaScript如何實現(xiàn)年月日三級聯(lián)動菜單”這篇文章就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，使各位可以學到更多知識，如果覺得文章不錯，請把它分享出去讓更多的人看到。
免責聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點不代表本網(wǎng)站立場，如果涉及侵權(quán)請聯(lián)系站長郵箱：is@yisu.com進行舉報，并提供相關證據(jù)，一經(jīng)查實，將立刻刪除涉嫌侵權(quán)內(nèi)容。
