如何设置一个选择框等于另一个?

时间:2012-03-25 23:32:49

标签: javascript

我有两个相同的选择框(当然除了它们的名字),我需要将第二个选择框的值设置为等于选中复选框时第一个选择框的值。这是我的代码的一部分:

<form id="theForm" name="theForm">

<select name="stateSelect" id="stateSelect">
        <option value="AL">Alabama</option>
        <option value="AZ">Arizona</option>
        <option value="AR">Arkansas</option>
</select>

<select name="stateSelect2" id="stateSelect2">
        <option value="AL">Alabama</option>
        <option value="AZ">Arizona</option>
        <option value="AR">Arkansas</option>
</select>

<input type="checkbox" name="checky" onClick="doStuff()">
</form>

doStuff() 
{
    // change it from here
}

所以,我尝试了很多不同的东西,包括我在论坛和SO上找到的代码,但似乎没有任何效果。我的javascript函数应该包含哪些代码,以便在函数运行时第二个选择框设置为等于第一个?

感谢您的帮助!

2 个答案:

答案 0 :(得分:3)

试试这个:

var s1=document.getElementById('stateSelect');
var s2=document.getElementById('stateSelect2');
s1.onchange=function(){
    s2.value=s1.value;
}

演示:http://jsfiddle.net/rLEvD/

答案 1 :(得分:0)

(其中#sel1是您首次选择的ID,#sel2是您第二次选择的ID,#checkbox是您的复选框的ID:)

$('#checkbox').click(function(){
    if ($('#sel2').attr('disabled') != 'disabled') {
        $('#sel2').attr('disabled', 'disabled');
        $('#sel2').val($('#sel1').val());}     
    else
        $('#sel2').removeAttr('disabled');
});
    $('#sel1').change(function(){
    if ($('#sel2').attr('disabled') == 'disabled')
        $('#sel2').val($(this).val());
});

请参阅http://jsfiddle.net/u4n7n/