JS Select 月日日期联动

Js对Select控件进行联动操作,一个select选择月份后另一个select生成对应月份的所有日期。

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <script type="text/javascript">
        window.onload = initForm;
        function initForm() {
            document.getElementById("months").selectedIndex = 0;
            document.getElementById("months").onchange = populateDays;
        }
        function populateDays() {
            var monthDays = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
            var monthStr = this.options[this.selectedIndex].value;
            if (monthStr != "") {
                var theMonth = parseInt(monthStr);
                document.getElementById("days").options.length = 0;
                for (var i = 0; i < monthDays[theMonth]; i++) {
                    document.getElementById("days").options[i] = new Option(i + 1);
                }
            }
        }
    </script>  
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <select runat="server" id="months">
                <option value="">Month</option>
                <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">November</option>
                <option value="11">December</option>
            </select>
            <select runat="server" id="days">
                <option>Day</option>
            </select>
        </div>
    </form>
</body>
</html>
原文地址:https://www.cnblogs.com/linhuide/p/5835878.html