Question

我试图隐藏或显示基于第一个选择框选项的选择框。我不确定为什么它不起作用。另一件事是，我如何在一个部分中添加多个ID（如果用户选择＆＃34;项目＆＃34;或＆＃34; mods＆＃34;以显示选择框2）？

选择框1：

<select name="category_0" id="category_0" onchange="qa_category_select('category');" class="king-form-tall-select" style="display: none;">
    <option value=""></option>
    <option value="1">Projects</option>
    <option value="2">Mods</option>
</select>

<span id="category_0_sub">
<select name="category_1" id="category_1" onchange="qa_category_select('category');" class="king-form-tall-select">
<option value="" selected=""></option>
<option value="1">Projects</option>
<option value="2">Mods</option>
</select>
<span id="category_1_sub"> <select name="category_2" id="category_2" onchange="qa_category_select('category');" class="king-form-tall-select">
<option value="" selected=""></option>
<option value="124">3D Art</option>
<option value="125">Adventure</option>
</select>
</span></span>

选择框2：

<select name="extra1" class="king-form-tall-select">
<option value="" selected=""></option>
<option value="value36">1.11</option>
<option value="value1">Older</option>
</select>

HTML in HTML：

<script>
$(document).ready(function(){
    $('#category_1').on('change', function() {
      if ( this.value == '1')
      {
        $("#extra1").show();
      }
      else
      {
        $("#extra1").hide();
      }
    });
});
</script>

如果有人知道如何解决这个问题，请告诉我。

Answer 1

<script>
$(document).ready(function(){
    var possibleValues = [1, 2];
    $('#category_1').on('change', function() {
      $("#extra1").toggle(possibleValues.indexOf(+this.value) !== -1);
    });
});
</script>

其中posibleValues是一个包含所有选择值的数组（在我的例子中，对于Projects和Mods，它是1和2）应该显示第二个选择。所以你不需要为第二个选择添加多个id（你也不能这样做，id是唯一的和单个单词）

另外，正如@Satpal注意到你需要将ID“extra1”添加到第二个选择

根据下拉框选择显示或隐藏选择框

1 个答案: