jQuery：单击后不触发事件

Question

实际使用中：http： //3.alphenweer.nl/weer/
码：

    $(document).ready(function(){
        $('.categorie[data-cat]').click(function(){
            $('#cat-'+ $(this).attr('data-cat')).slideToggle('slow');
        });
    });

<span class="categorie" data-cat="nieuws">Nieuws</span>
<div class="box" id="box-nieuws">
    <a href="/pages/nieuws/nieuws/alphen.php">Alphen</a>
    <a href="/pages/nieuws/nieuws/nederland.php">Nederland</a>
</div>

问题：当我单击菜单按钮时（在示例中：单击“ Neerslag”或“ Satteliet”），什么都没有发生。 我认为选择器不正确，但应该正确。 你们能帮我吗？

Answer 1

我觉得你有点困惑。 似乎您要使用单击的.categorie的data属性来滑动相应的元素。 因此，您可以执行以下操作：

$('.categorie[data-cat]').click(function(){
    $('div[id=box-"' + $(this).attr('data-cat') + '"]').slideToggle('slow');
});

或者，假设结构与您发布的结构一致，则可以更简单：

$('.categorie[data-cat]').click(function(){
    $(this).next(".box").slideToggle('slow');
});

Answer 2

已经发现问题：

$(document).ready(function(){
    $('.categorie[data-cat]').click(function(){
        $('#cat-'+ $(this).attr('data-cat')).slideToggle('slow');
    });
});

第三行中的$('#cat-'应该是$('#box-'