實現表單聯動
阿新 • • 發佈:2018-01-09
option pos tex pat 輸出 spa ice title options
<html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <style> label { display: inline-block; width: 80px; height: 30px; text-align: right; margin-top: 20px; } </style> </head> <body> <label for="">出生日期:</label> <!-- name 改的話 要改css js --> <select name="date_year" id="year" class="n"> </select> <span>年</span> <select name="date_month" id="year" class="n"> </select> <span>月</span> <select name="date_day" id="year" class="n"> </select> <span>日</span> <br> <script> TLmonth = [‘1‘, ‘3‘, ‘5‘, ‘7‘, ‘8‘, ‘10‘, ‘12‘]; var data_year = document.querySelector(‘select[name=date_year]‘), data_year = document.querySelector(‘select[name=date_year]‘), data_month = document.querySelector(‘select[name=date_month]‘), data_day = document.querySelector(‘select[name=date_day‘), select = document.getElementsByTagName(‘select‘); /* 要求:當前年份的前28年 - 18年 */ function agoDate() { var date = new Date(); // 獲取當前年份 var now_year = date.getFullYear(); var agone_year = now_year - 28; // 28年前的年份 var agone_date = new Date(agone_year + ‘-01-01‘); // 28 年前的時間 return agone_year; } function export_year() { var year = agoDate(); for (var i = 0; i < 18; i++) { data_year.add(new Option(year + i, year + i)) } } function export_month() { var index = data_year.selectedIndex; var selected = data_year.options[index]; //選擇的年 for (var i = 1; i <= 12; i++) { data_month.add(new Option(i, i)) } } // 輸出 天數 function export_day() { var index = data_year.selectedIndex; var year = data_year.options[index].value; //選擇的年 var index = data_month.selectedIndex; var month = data_month.options[index].value; //選擇的月 // 判斷是不是潤年 if (year % 4 == 0 && year % 100 != 0 || year % 400 == 0) { if (month == ‘2‘) { each_day(29) } else { var bol = Judgment(month); // console.log(bol) // 判斷是不是31天 if (bol) { each_day(31) } else { each_day(30) } } } else { if (month == ‘2‘) { each_day(28) } else { var bol = Judgment(month); // console.log(bol) if (bol) { each_day(31) } else { each_day(30) } } } } // 遍歷輸出 天 function each_day(num) { data_day.innerHTML = ‘‘; for (var i = 1; i <= num; i++) { data_day.add(new Option(i, i)) } } // 判斷月份 function Judgment(month) { var bol = TLmonth.indexOf(month); if (bol >= 0) { return true; } else { return false; } } // 選擇了年份的時候輸出月 data_year.onchange = function () { export_month() } // 選擇了月份的時候輸出日 data_month.onchange = function () { export_day() } // 默認選擇項目 function selected_() { export_year() select[0][0].selected = true; export_month() select[1][0].selected = true; export_day() } // 默認選中 selected_() </script> </body> </html>
實現表單聯動