0

ここに私のコードの完全なコードがあります:

<!doctype html>

<html>
<head>
    <meta charset="utf-8">
    <title>Date Picker</title>
</head>
<body>
<strong>Departing:</strong><br/>
<select name='dateSingleMonthDeparting' onChange='changeDate(this.options[selectedIndex].value);'>
    <option value='na'>Month</option>
    <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 name='dateSingleDayDeparting' id='day'>
    <option value='na'>Day</option>
</select>
<select name='dateSingleYearDeparting' id='year'>
    <option value='na'>Year</option>
</select><br/>



<strong>Returning:</strong><br/>
<select name='dateSingleMonthReturning' onChange='changeDate(this.options[selectedIndex].value);'>
    <option value='na'>Month</option>
    <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 name='dateSingleDayReturning' id='day'>
    <option value='na'>Day</option>
</select>
<select name='dateSingleYearReturning' id='year'>
    <option value='na'>Year</option>
</select>



<script>
function changeDate(i){
    var e = document.getElementById('day');
    while(e.length>0){
        e.remove(e.length-1);
        var j=-1;
        if(i=="na"){
            k=0;
        }else if(i==2){
            k=28;
        }else if(i==4||i==6||i==9||i==11){
            k=30;
        }else{
            k=31;
        }
    }
    while(j++<k){
        var s=document.createElement('option');
        var e=document.getElementById('day');
        if(j==0){
            s.text="Day";
            s.value="na";
            try{
                e.add(s,null);
            }catch(ex){
                e.add(s);
            }
        }
        else{
            s.text=j;
            s.value=j;
            try{
                e.add(s,null);
            }catch(ex){
                e.add(s);
            }
        }
    }
}
var currentTime = new Date();
y = currentTime.getFullYear()+1;
while (y-->1909){
    var s = document.createElement('option');
    var e = document.getElementById('year');
    s.text=y;
    s.value=y;
    try{
        e.add(s,null);
    }catch(ex){
        e.add(s);
    }
}
</script>
</body>
</html>

私は2人のデートピッカーを持っています。最初のものを変更すると完全に機能しますが、2番目のものを変更すると、関数は最初のdatepcikerで機能します

日付ピッカーごとに独自の機能を持たせたい。これを実現するにはどうすればよいですか？私はすでにこのようなものを入れようとしましgetElementById('day day2')たが、うまくいきません。

4

1 に答える 1

3

selectマークアップでiddayとyear2 回を割り当てました。それは間違いです。ID は一意である必要があります。

これらの ID を day1、year1、day2、および year2 に変更してください。次に、これらの ID をパラメーターとして thischangeDate(this.value, "day1", "year1")および thisのような関数に渡しますchangeDate(this.value, "day2", "year2")。

ここで、changeDate を次のように定義します。

function changeDate(i, day, year) {
    var e = document.getElementById( day ); // please note that day is the variable passed

    ...................
}

無関係な補足として、this.options[selectedIndex].valueと同じですthis.value

于 2012-09-05T01:47:06.733 に答える