根据下拉条目显示/隐藏Div元素

我有4个Div元素和一个下拉列表。 如果我选择一个下拉选项，例如“2”，则显示DivElement2 ，并隐藏所有其他选项。

我想改变它，所以当我选择选项“2”时，会显示DivElement1和DivElement2 。 我想这将不得不通过一些循环函数，但我不知道如何去做。

  1 2 3 4  
Div1
 
Div2
 
Div3
 
Div4 

---

这是当前的jquery函数，它基本上首先将hide添加到所有内容，然后将其从它希望显示的元素中删除。

 if($(this).attr('name') == 'Count') { $('.CommonAttribute').addClass('hide'); $('.DivElement' + $(this).val()).removeClass('hide'); } 

感谢大家！

Answer 1

无需循环：

 $('.CommonAttribute').hide(); $('select[name="Count"]').change(function () { $('.CommonAttribute').hide(); $('.CommonAttribute:lt(' + $(this).val() + ')').show() }) 

jsFiddle示例

Answer 2

你可以尝试这样的事情：

JS

 $("select").on("change", function(){ $("div").hide(); show(parseInt($(this).val())); }); function show(counter){ for(var i=1; i<=counter; i++){ $(".DivElement"+i).show(); } } 

小提琴