Question

以下代码根据表单中选择的月份验证月中的天数。月份值从1月到12月开始，从1到31天，从1900年到2010年。我正在尝试进行一个非常小的更改，我想在三个下拉框中的每一个中添加第一个选项，一个空白选择选项或例如破折号。因此，月份下拉的第一个选项是 - 而不是Jan。为此，我在每个下拉列表中添加以下行。

<option value=""> - </option>

但是通过添加它，它没有正确地显示1月和2月的天数（它显示比它应该少1天）。这是一些javascript问题，但我不明白有什么问题。如果你能帮助我，我将非常感激。这里是用于填充表单的HTML，Javascript和php的完整代码。

<?php
$monthOptions = '';
$dayOptions = '';
$yearOptions = '';
 for($month=1; $month<=12; $month++){
    $monthName = date("M", mktime(0, 0, 0, $month));
    $monthOptions .= "<option value=\"{$month}\">{$monthName}</option>\n";
} for($day=1; $day<=31; $day++){
    $dayOptions .= "<option value=\"{$day}\">{$day}</option>\n";
} for($year=1900; $year<=2010; $year++){
    $yearOptions .= "<option value=\"{$year}\">{$year}</option>\n";
}
?>
<html>
<head>
<script type="text/javascript">

function updateDays()
{
    //Create variables needed
    var monthSel = document.getElementById('month');
    var daySel   = document.getElementById('day');
    var yearSel  = document.getElementById('year');
    var monthVal = monthSel.value;
    var yearVal  = yearSel.value;

    //Determine the number of days in the month/year
    var daysInMonth = 31;
    if (monthVal==2){
        daysInMonth = (yearVal%4==0 && (yearVal%100!=0 || yearVal%400==0)) ? 29 : 28;
    } else if (monthVal==4 || monthVal==6 || monthVal==9 || monthVal==11) {
        daysInMonth = 30;
    }   
    //Add/remove options from days select list as needed
    if(daySel.options.length > daysInMonth){   //Remove excess days, if needed
        daySel.options.length = daysInMonth;
    } while (daySel.options.length != daysInMonth){   //Add additional days, if needed
        daySel.options[daySel.length] = new Option(daySel.length+1, daySel.length+1, false);
    }   
    return;
}

</script>
</head>
<body>
Birthdate:<br />
<select name="month" id="month" onchange="updateDays();">
<?php echo $monthOptions; ?>
</select>

<select name="day" id="day">
<?php echo $dayOptions; ?>
</select>

<select name="year" id="year" onchange="updateDays();">
<?php echo $yearOptions; ?>
</select>

</body>
</html>

感谢您的帮助。

Answer 1

为什么不使用optgroup：

<optgroup label="-"> ... </optgroup>

不过，好名字！

Answer 2

不要重新发明轮子，使用内置的Date对象来检查日期。

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

您的代码中也出现错误：“{”就在评论“删除多余天数，如果需要”之前不需要。

Answer 3

也许这就是你想要的？

http://plungjan.name/scripts/date/calendars/datepickers/seldate.html

如果您有疑问或需要修改，请告诉我

请求javascript的小帮助

3 个答案: