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>

我有两个日期选择器。当我更改第一个时,它可以完美运行,但是如果我更改第二个,则功能将在第一个 datepciker 中运行

我希望他们对每个日期选择器都有自己的功能。我将做些什么来实现这一点?我已经尝试过制作这样的东西,getElementById('day day2')但它不起作用。

4

1 回答 1

3

select已在标记中分配了 iddayyear两次。那是错的。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].valuethis.value

于 2012-09-05T01:47:06.733 回答