在HTML上使用jQuery为生日/出生日期格式选择菜单

Question

我希望有一个标准的HTML选择菜单来选择您的出生日期.日月年.有人能指出我正确的方向使用jQuery来格式化当月的正确天数,具体取决于选择的年/月等？是否有任何插件可以实现这一目标,或者我将如何自己编写？任何意见,将不胜感激.

Answer 1

基本上你需要三个选择框(日,月,年)以及年和月的onchange事件.

年份和月份选择框的更改需要更新天数,因为这些取决于年份和月份.要计算给定月/年的天数,本文将会有所帮助.

http://www.electrictoolbox.com/javascript-days-in-month/

工作示例JSFIDDLE

HTML

<select id="days"></select>
<select id="months"></select>
<select id="years"></select>

JS

$(function() {

    //populate our years select box
    for (i = new Date().getFullYear(); i > 1900; i--){
        $('#years').append($('<option />').val(i).html(i));
    }
    //populate our months select box
    for (i = 1; i < 13; i++){
        $('#months').append($('<option />').val(i).html(i));
    }
    //populate our Days select box
    updateNumberOfDays(); 

    //"listen" for change events
    $('#years, #months').change(function(){
        updateNumberOfDays(); 
    });

});

//function to update the days based on the current values of month and year
function updateNumberOfDays(){
    $('#days').html('');
    month = $('#months').val();
    year = $('#years').val();
    days = daysInMonth(month, year);

    for(i=1; i < days+1 ; i++){
            $('#days').append($('<option />').val(i).html(i));
    }
}

//helper function
function daysInMonth(month, year) {
    return new Date(year, month, 0).getDate();
}