javascript - 如何重置/显示隐藏后的所有元素

Question

请看一下这个( fiddle )。我想使用选择框中的数据属性来获取类名称并隐藏一些无序列表项。但我正在努力找出如何使用 show() 重置列表并在隐藏后显示所有项目。谁能告诉我如何将第一个选项设置为重置选项？

JS 代码:

$(document).ready(function(){
    $(".showhidelist").change(function() {
        var  selected = $(this).find('option:selected');
        selected = selected.data('hide');
        $("."+selected).hide();   
    });
});

HTML

<select class="showhidelist">
    <option data-hide="">Reset/Show All</option>
    <option data-hide="year">Hide Year</option>
    <option data-hide="month">Hide Month</option>
</select>

<ul id="list">
    <li class="year">2004</li>
    <li class="month">Feb</li>
<ul>

Answer 1

隐藏值后，您不会将选项重置为初始状态。使用 $('li').show();重置要显示的 li，然后根据选择执行操作。

$(document).ready(function(){
    $(".showhidelist").change(function() {
        var  selected = $(this).find('option:selected');
        $('li').show();
        selected = selected.data('hide');
        $("."+selected).hide();   
    });
});