Question

我有两个下拉列表，让用户选择具有相同代码的月份：

   <select id="Month1" name="Month1" >
     <option>Month</option>
     <option>January</option>
           so on ...
    </select>


   <select id="Month2" name="Month2" >
     <option>Month</option>
     <option>January</option>
           so on ...
    </select>

第一个列表id是“Month1”，第二个列表id是“Month2”

我想要的是：当用户从第一个列表中选择一个月（onclick）时，第二个列表会自动选择相同的...换句话说，第一个列表onclick动作也会在第二个列表中发送所选择的月份。

Answer 1

您可以： http://jsfiddle.net/NY2UL/

<select id="Month1" name="Month1" onchange="document.getElementById('Month2').value=this.value">
    <option>Month</option>
    <option>January</option>
    so on ...
</select>


<select id="Month2" name="Month2" onchange="document.getElementById('Month1').value=this.value">
    <option>Month</option>
    <option>January</option>
    so on ...
</select>

Answer 2

使用

 $('#Month1').on("change",function() {      
      $("#Month2 option[text="+$('#Month1').val()+"]").attr("selected","selected");
    });

Answer 3

<form id="whatever">
    <select id="Month1" name="Month1">
        <option>Jan</option><option>Feb</option></select>
    <select id="Month2" name="Month2">
        <option>Jan</option><option>Feb</option></select>
</form>

如果他们是带有ID的表单，您可以这样做：

document.forms.whatever.Month1.onchange = function () {
    this.form.Month2.value = this.value;
};

http://jsfiddle.net/42FfK/

修改

如果您想要更加懒惰并使用内嵌事件事件处理程序（如您选择的答案），您也可以跳过getElementById：

<form> <select id="Month1" name="Month1" onchange="Month2.value = this.value"> <option>Jan</option><option>Feb</option></select> <select id="Month2" name="Month2"> <option>Jan</option><option>Feb</option></select> </form>

http://jsfiddle.net/42FfK/1/

将所选选项从一个下拉列表复制到另一个

3 个答案: