javascript - 单击第一个选项标签时如何更改选项项？

Question

我在网页上设置了 7 选项。单击第一个选项标签时如何更改选项项？

• （代码图像）
• ■选项1 A、B、C
• □选项2 (A:10, B:20, C:30)
• □选项3 (A:15, B:25, C:35)
• ...

• □选项7 (A:18, B:28, C:38)

• （结果）

• 选择option1的A按钮的情况下
• 选项2 -> 10
• 选项3 -> 15
• ...
• 选项7 -> 18

（真实代码示例）

Selection of A, B, C
<select name="preset" id="SaveAccount3" type="submit" value="option1" />
                 <option value="A">A</option>
                 <option value="B">B</option>
                 <option value="C">C</option>
</select>

<ul id="measureid">
            <li><label for="CreditcardMonth">option2</label>
            <select id="measureidsize1" name="measure1" class="chkselect">
                <option value="10">10</option>
                <option value="20">20</option>
                <option value="30">30</option>
            </select></li>

            <li><label for="CreditcardMonth">option3</label>
            <select id="measureidsize1" name="measure1" class="chkselect">
                <option value="15">15</option>
                <option value="25">25</option>
                <option value="35">35</option>
            </select></li>

<!-- abbreviation -->

            <li><label for="CreditcardMonth">option7</label>
            <select id="measureidsize1" name="measure1" class="chkselect">
                <option value="18">18</option>
                <option value="28">28</option>
                <option value="38">38</option>
            </select></li>

Answer 1

请看一下http://jsfiddle.net/z87qf/1/

$('#SaveAccount3').change(function(){
    var option = $("option:selected", this).val();
    option == "A"? (opt=0) : (option == "B"? (opt=1): (opt=2))
    $.each($('select[class=chkselect]'),function(i){
        $('select[id=measureidsize'+i+'] option:eq('+opt+')').attr('selected', 'selected');
    });
});

这是你的要求吗？

Answer 2

您可以使用 jQuery 并执行类似的操作。

使用更改事件并相应地设置值。

以下代码只是为了让您入门。

$('#SaveAccount3').change(function(){
    var val = $(this).val();

    //you can write your logic with if-else or switch construct

    $('#measureidsize1').val('50'); //you can set value like this
    //if you set value beside what is there in options for that select box it won't set

});