JQuery 循环遍历 DIV 来隐藏/显示

Question

我有一个组合框，可以选择 0 - 8 和 8 组输入字段，其中每组输入字段都包裹在具有相同类的 div 周围。

我需要了解如何使用 Jquery 根据所选组合框值隐藏/取消隐藏 div。例如，如果我选择2，那么class="member1"和class="member2"需要可见，其余的都是不可见的。如果我改变主意并选择 1，则 class="member1"保持可见，但 member2 和其余部分设置为不可见？

<div class="member1"> 
<input id="name1">
<input id="age1">
</div>
<div class="member2"> 
<input id="name2">
<input id="age2">
</div>
:
:
<div class="member8"> 
<input id="name8">
<input id="age8">
</div>

Answer 1

这很简单。考虑到 selected_number 已经是从您正在讨论的选择字段中提取的整数，代码可能如下所示:

jQuery(function(){
    var selected_number = 2;
    jQuery('.member1, .member2, .member3, .member4, .member5, .member6, .member7, .member8').hide();
    for (var i=1; i<=selected_number;i++){
        jQuery('.member'+i).show();
    }
});

作为证明see this jsfiddle (更改 selected_number 值以查看其工作原理)。