添加YYYY, MM, DD下拉列表,用于在网页上选择日期

Add YYYY, MM, DD dropdown lists for selecting a date on a webpage

本文关键字:网页 选择 日期 下拉列表 YYYY MM DD 添加 用于      更新时间:2023-09-26

我想添加下拉式日期选择器,它根据所选的年份和月份重新填充日期列表。2008年2月有29天,4月有30天,6月有31天等等……我如何使用javascript做到这一点?

这可能有帮助

http://javascript.internet.com/forms/date-selection-form.html

我建议使用

http://jqueryui.com/demos/datepicker/

这是你要找的吗?

http://keith-wood.name/datepick.html

HTML

<select name="" id="year">
    <option value="2016">2016</option>
    <option value="2015">2015</option>
    <option value="2014">2014</option>
    <option value="2013">2013</option>
    <option value="2012">2012</option>
</select>
<select name="" id="month">
    <option value="0">January</option>
    <option value="1">February</option>
    <option value="2">March</option>
    <option value="3">April</option>
    <option value="4">May</option>
    <option value="5">June</option>
    <option value="6">July</option>
    <option value="7">August</option>
    <option value="8">September</option>
    <option value="9">October</option>
    <option value="10">Novenmer</option>
    <option value="11">December</option>
</select>
<select name="" id="day">
</select>    
脚本

<script>
        $(document).ready(function(){
            dpick('#year','#month','#day',1);
        });
        function dpick(year,month,day,td){
            if(td==1){
                var today = new Date();
                $(year).val(today.getFullYear());
                $(month).val(today.getMonth());
            }
            $(year).change(function(){
                dpick(year,month,day);
            });
            $(month).change(function(){
                dpick(year,month,day);
            }); 
            var month_val = $(month).val();
            var i=0;
            $(day).empty();
            if(month_val=="1"){
                if($(year).val()%4 == 0){
                    for(i=1;i<=29;i++){
                        $(day).append($("<option></option>").attr("value", i).text(i));
                    }
                }else{
                    for(i=1;i<=28;i++){
                        $(day).append($("<option></option>").attr("value", i).text(i));
                    }
                }
            }
            else if(month_val=="8" || month_val=="3" || month_val=="5" || month_val=="10"){
                for(i=1;i<=30;i++){
                    $(day).append($("<option></option>").attr("value", i).text(i));
                }
            }
            else{
                for(i=1;i<=31;i++){
                    $(day).append($("<option></option>").attr("value", i).text(i));
                }
            }
            if(td==1){
                $(day).val(today.getDate());
            }
        }
    </script>