年月日下拉选择三级联动(闰年判断),时间获取方法总结,特殊:获取当前月天数

html

年:<select id="year"></select>
月:<select id="month"></select>
日:<select id="date"></select>

js

    //获取当前时间
    var MyDate = new Date();
    //获取当前年
    var yearNow = MyDate.getFullYear();
    //获取当前月[月为0-11所以加1]
    var monthNow = MyDate.getMonth()+1;
    //获取当前天
    var DateNow = MyDate.getDate();
    //获取当前月有多少天
    var curMonthDays = new Date(MyDate.getFullYear(), (MyDate.getMonth()+1), 0).getDate();
    //标志,日期未做任何改变,用来给天加判断
    var flag = 0;
    $(function(){
        initYear();//初始化年
        initMonth();//初始化月
        initDate(curMonthDays);//初始化日,传参这个月有多少天
        $('#year').change(changeYear);//年改变
        $('#month').change(changeMonth);//月改变
    })
    //初始化年
    function initYear(){
        //前后五年时间循环
        var str ="";
        for(var i = yearNow-5; i < yearNow+5; i++){
            str += "<option value='"+i+"'>"+i+"</option>";
        }
        //放入页面并设置默认值为当前年
        $('#year').html(str).val(yearNow);
    }
    //初始化月
    function initMonth(){
        //月份循环
        var str ="";
        for(var i = 1;  i < 13; i++){
            str += "<option value='"+i+"'>"+i+"</option>";
        }
        //放入页面并设置默认值为当前月
        $('#month').html(str).val(monthNow);
    }
    //初始化天,传参数默认值为31天
    function initDate(num){
        //根据传入参数循环天数
        var str ="";
        var DateSel = $('#date').val();
        for(var i = 1; i <= num; i++){
            str += "<option value='"+i+"'>"+i+"</option>";
        }
        //当标志为0即未改变,日期设置默认值为当前日期
        if(flag == 0){
            $('#date').html(str).val(DateNow);
            //当标志改变时,日期设置为选中的日期
        }else{
            $('#date').html(str).val(DateSel);
        }
    }
    //年改变函数
    function changeYear(){
        //获取选中的年
        var year = $('#year').val();
        //获取选中的月
        var month = $('#month').val();
        flag = 1;//标志改变
        //如果月份为2月
        if(month == 2){
            //并且为闰年
            if(year%4 == 0 && year%100 !=0 || year%400 == 0){
                //天数传参29天
                initDate(29);
            }else{
                //否则天数传参28天
                initDate(28);
            }
        }
    }
    //月改变函数
    function changeMonth(){
        //获取选中的月
        var month = $('#month').val();
        flag = 1;//标志改变
        //当月份为4 6 9 11时
        if(month == 4 || month == 6 || month == 9 || month == 11){
            //天数传参30天
            initDate(30);
        //月份为2时
        }else if(month == 2){
            //执行改变年函数
            changeYear();
        }else{
            //其他月份天数传参31天
            initDate(31);
        }
    }

2月判断在改变年的函数当中,

当月份改变为2月时调用年改变函数。

方法二:

  初始化年月不变,天函数中做判断,当改变年月时调用天函数。

下面为天函数

    //这里是另一种天函数
    //获取选中的年
    var year = $('#year').val();
    //获取选中的月
    var month = $('#month').val();
    //天数默认31
    var ts = 31;
    if(month == 4 || month == 6 || month == 9 || month == 11){
        ts = 30;
    }else if(month == 2){
        if(year%4 == 0 && year%100 !=0 || year%400 == 0){
            //天数传参29天
            ts = 29;
        }else{
            //否则天数传参28天
            ts =28;
        }
    }
    var str = "";
    for(var i = 1; i <= ts; i++){
        str +="<option>"+i+"</option>";
    }
    $('date').html(str);

总结:时间获取     var t = new Date();

new Date 获取当前日期和时间。  eg:2018-06-24T09:33:12.309Z

t.getFullYear() 获取当前年(4位)

t.getYear(); //获取当前年份(2位)

t.getMonth() 获取月份 (0-11)所以当前月份应加一

t.getDate() 获取当前天

t.getDay() 获取当前星期(0-6)

t.getTime(); //获取当前时间(从1970.1.1开始的毫秒数)

t.getHours(); //获取当前小时数(0-23)

t.getMinutes(); //获取当前分钟数(0-59)

t.getSeconds(); //获取当前秒数(0-59)

t.getMilliseconds(); //获取当前毫秒数(0-999)

t.toLocaleString()日期时间转换为中文。

特别提示://获取当前月有多少天 var curMonthDays = new Date(MyDate.getFullYear(), (MyDate.getMonth()+1), 0).getDate();

具体原因不明。