jquery 更改/切换？

Question

我们想要创建一个表单，当在一个选择框中选择一个选项时，另一个选择框中的选项会发生变化，具体取决于所选择的内容。

例子:

Select box 1
Option A
Option B

Select box 2
Options change depending on if A or B is chosen

我们怎样才能做到这一点？

Answer 1

有几种方法，具体取决于您是否希望通过 Ajax 调用第二个选择框的选项，或者是否有两种可能性。

HTML

<select id="select1">
    <option value="a">a</option>
    <option value="b">b</option>
</select>

<select id="select2a" style="display:none;">
    <!-- options -->
</select>

<select id="select2b" style="display:none;">
    <!-- options -->
</select>

jQuery

$('#select1').change(function(){

    if($(this).val() == "a"){

        $('#select2a').show();
        $('#select2b').hide();      

    }elseif($(this).val() == "b"){

        $('#select2a').hide();
        $('#select2b').show();  

    }

});

如果您不想使用两个单独的选择框，您可以将选项存储在一个变量中，并根据在第一个选择框中选择的选项更改选择框的 .html()。