html-head中:
<script src="js/jq/jquery-3.5.1.min.js"></script> /*注意该文件*/
<style>
.layui-input:focus,
.layui-textarea:focus {
border-color: #2989b6 !important;
}
</style>
body:{
<div class="time">
<p>开始时间：    <select id="years" οnchange="doChange1()"></select>
年<select id="months" οnchange="doChange1()"></select>
月<select id="dates"></select>日</p>
<p>结束时间：    <select id="year" οnchange="doChange()"></select>
年<select id="month" οnchange="doChange()"></select>
月<select id="date"></select>日</p>
</div>
}
js中：
var today = new Date();
var year = today.getFullYear();
var month = today.getMonth();
var date = today.getDate();
window.onload = function () {
for (var i = year+100; i >= year-100; i--) {
var option = new Option(i, i);
// 如果年份等于当前年份 就默认选择
if (i == year) {
option.selected = true;
}
// 添加到id为year的select中
ID('year').add(option);
}
// 循环月份
for (var j = 1; j <= 12; j++) {
var option = new Option(j, j);
if ((j - 1) == month) {
option.selected = true;
}
ID('month').add(option);
}
// 页面加载调用doChange事件
doChange();
// 循环年份并且显示到页面
for (var i = year+100; i >= year - 100; i--) {
var option = new Option(i, i);
// 如果年份等于当前年份 就默认选择
if (i == year) {
option.selected = true;
}
// 添加到id为year的select中
ID('years').add(option);
}
// 循环月份
for (var j = 1; j <= 12; j++) {
var option = new Option(j, j);
if ((j - 1) == month) {
option.selected = true;
}
ID('months').add(option);
}
// 页面加载调用doChange事件
doChange1();
$("select").next().remove();
}
function doChange() {
// 把ID('date')中的option长度变为0
ID('date').options.length = 0;
var length = 31;
// 获取月份
var mon = ID('month').value;
// 如果是2月
if (mon == 2) {
// 平年就是28
length = 28;
// 获取年份
var num = ID('year').value;
// 判断是不是闰年 闰年就是29
if ((num % 4 == 0 && num % 100 != 0) || num % 400 == 0) {
length++;
}
}
// 定义正则判断月份 4 6 9 11 月
var reg = / [469]|^11$/;
// 符合条件就是30天
if (reg.test(mon)) {
length = 30;
}
// 然后循环 把值塞进去
for (var k = 1; k <= length; k++) {
var option = new Option(k, k);
if (k == date && mon == month + 1) {
option.selected = true;
}
ID('date').add(option);
}
}
function doChange1() {
// 把ID('dates')中的option长度变0
ID('dates').options.length = 0;
var length = 31;
// 获取月份
var mon = ID('months').value;
// 如果是2月
if (mon == 2) {
// 平年就是28
length = 28;
// 获取年份
var num = ID('years').value;
// 判断是不是闰年 闰年就是29
if ((num % 4 == 0 && num % 100 != 0) || num % 400 == 0) {
length++;
}
}
// 定义正则判断月份 4 6 9 11 月
var reg = / [469]|^11$/;
// 符合条件就是30天
if (reg.test(mon)) {
length = 30;
}
// 然后循环 把值塞进去
for (var k = 1; k <= length; k++) {
var option = new Option(k, k);
if (k == date && mon == month + 1) {
option.selected = true;
}
ID('dates').add(option);
}
}
// 封装获取id的简化函数
function ID(id) {
return document.getElementById(id);
}
