Question

使用JQuery我希望用户从下拉列表中选择一个项目，当他完成它时，会出现另一个项目。应该总共有4个下拉列表。

JQuery的

<script>
    $("select: nth-child(1)").click(function () {
      $("select: nth-child(2)").show();
    });

     $("select: nth-child(2)").click(function () {
      $("select: nth-child(3)").show();
    });
    $("select: nth-child(3)").click(function () {
      $("select: nth-child(4)").show();
    });
</script>

HTML：

<form>
<div id="one">
<select>
  <option value="1">a</option>
  <option value="2">b</option>
</select>
</div>
<div id="two">
<select>
  <option value="3">c</option>
  <option value="4">d</option>
</select>
</div>
<div id="three">
<select>
  <option value="5">e</option>
  <option value="6">f</option>
</select>
</div>
<div id="four">
<select>
  <option value="7">g</option>
  <option value="8">h</option>
</select>
</div>
</form>

Answer 1

我稍微修改了你的js和css：

在document.ready()上显示第一个选择显示当前选择的下一个选择 -

$(document).ready(function(){
    $("select").eq(0).show();
});

$('select').change(function(){
    $('select').eq($(this).index('select') + 1).show(); 
});

此代码执行的示例：JSFiddle

点击/完成选择下拉列表，显示更多选择下拉列表

1 个答案: