使用下拉列表jquery插件过滤页面上的div

时间:2015-12-16 13:41:23

标签: javascript jquery html css filtering

我有一个页面上有很多类似的<div>元素,我需要允许用户通过从下拉列表中选择值来过滤它。 有没有简单的jquery插件可以做到这一点?我发现http://luis-almeida.github.io/filtrify/但它太复杂了,我需要通过下拉菜单进行简单的过滤。

1 个答案:

答案 0 :(得分:0)

取决于你的过滤逻辑,但这样的东西?

<select id="sel">
<option value="one">one</option>
<option value="two">two</option>
<option value="three">three</option>
</select>

<div class="filt one">one</div>
<div class="filt one">one</div>
<div class="filt one">one</div>
<div class="filt one">one</div>
<div class="filt one">one</div>
<div class="filt one">one</div>
<div class="filt two">two</div>
<div class="filt two">two</div>
<div class="filt two">two</div>
<div class="filt two">two</div>
<div class="filt three">three</div>

<script> 
$("#sel").on("change", function(){
$(".filt").show();
$("."+$(this).val()).hide();
});
</script>