自动加载年月日三个下拉框，选择年月后动态加载日期

最新推荐文章于 2023-08-24 18:07:21 发布

HelloWorld小能手

最新推荐文章于 2023-08-24 18:07:21 发布

阅读量875

点赞数 1

分类专栏：前端文章标签： js javascript jquery html

本文链接：https://blog.csdn.net/qq_43379834/article/details/116719620

版权

本文介绍如何使用JavaScript获取系统时间并创建年月日三个下拉框。当选择年月时，动态生成相应月份的日期选项，并默认选中最后一天。

摘要由CSDN通过智能技术生成

用js获取系统时间生成年月日三个下拉框，选择年月后动态加载日期，并默认选中最后一天

一、效果
在这里插入图片描述

二、HTML代码

<h3>用js生成年月日三个下拉框，选择年月后动态加载日期，并默认选中最后一天</h3><br />
    <div id="selectinput">
    </div>

三、js

$(function () {
   
            //插入下拉框
            insert_element();
            //插入年份
            insert_year_option();
            //插入月份
            insert_month_option();
            //触发月份的change事件
            $("#month").change();

        });
        //插入下拉框
        function insert_element() {
   
            $("#selectinput").empty();
            var yearsel = $("<select></select>").attr("id", "year");
            var monthsel = $("<select></select>").attr("id", "month");
            var daysel = $("<select></select>").attr("id", "day");
            $("#selectinput").append("年：").append(yearsel).append("月：").append(monthsel).append("日：").append(daysel);
        }
        //插入年份
        function insert_year_option() {
   
            var myDate = new Date();
            var year = myDate.getFullYear();
            for (var i = year - 10; i < year + 10; i++) {
   
                if (i == year)