0

フォームのドロップダウン リストで選択した各月の日数を事前設定するために、次のようにコーディングしました。これは閏年もテストします (2000 年以降は不要なので)。このコードは私にとっては正しく機能しているように見えますが、より少ないコードでこれを行うより効率的な方法はありますか?

<script>
    function is_leap()
    {
        var year=document.getElementById('f_year').value;
        var a = 2000;
        for(a;a<year;a+=4)
        {
        }

        if(a==year)
        {
            return true;
        }
        else return false;
    }

    function out_days(v)
    {
        var html = '';
        for(var x=1;x<=v;x++)
        {
            html += '<option value="' + x + '">' + x + '</option>';
        }
        document.getElementById('f_day').innerHTML=html;                
    }

    function chk_mon()
    {
        var e = document.getElementById('f_month').selectedIndex;
        switch(e)
        {
            case 0: case 2: case 4: case 6: case 7: case 9: case 11:
            {                   
                out_days(31);
                break;
            }   
            case 1:
            {
                if(is_leap())
                {
                    out_days(29);
                }
                else out_days(28);
                break;
            }
            case 3: case 5: case 8: case 10:
            {
                out_days(30);
                break;
            }
            default:
            {
                out_days(31);
                break;
            }
        }
    }
</script>

<form action="index.php" method="post" name="form">
    Date:<select onchange="chk_mon()" id="f_month" name="from_month">
        <option value="1">January</option>
        <option value="2">February</option>
        <option value="3">March</option>
        <option value="4">April</option>
        <option value="5">May</option>
        <option value="6">June</option>
        <option value="7">July</option>
        <option value="8">August</option>
        <option value="9">September</option>
        <option value="10">October</option>
        <option value="11">November</option>
        <option value="12">December</option>
    </select>
    <select id="f_day" name="from_day">
        <script>
            chk_mon();
        </script>
    </select>
    <select onchange="chk_mon()" id ="f_year" name="from_year">
        <option value="2013">2013</option>
        <option value="2014">2014</option>
        <option value="2015">2015</option>
        <option value="2016">2016</option>
        <option value="2017">2017</option>
        <option value="2018">2018</option>
        <option value="2019">2019</option>
        <option value="2020">2020</option>
        <option value="2021">2021</option>
        <option value="2022">2022</option>
        <option value="2023">2023</option>
        <option value="2024">2024</option>
        <option value="2025">2025</option>
        <option value="2026">2026</option>
        <option value="2027">2027</option>
        <option value="2028">2028</option>
        <option value="2029">2029</option>
        <option value="2030">2030</option>
    </select>
</form>
4

1 に答える 1

2

非常にクリーンな JQuery の DatePicker を試すこともできます。この例は、実際には JQuery の Web サイトhttp://jqueryui.com/datepicker/からのものです。

 //JQuery and JQuery UI CDNs - Place in <head>
 <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
 <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

 //JS Fn - Place in <head>
 <script>
 $(function() {
    $( "#datepicker" ).datepicker();
 });
 </script>

 //Put this in the <body>
 <p>Date: <input type="text" id="datepicker" /></p>
于 2013-10-08T18:52:24.930 に答える