ul li选择器不起作用

debugcn 发表于 Dev

卢博·瓦列夫斯基

我在使用jquery时遇到问题。单击导航中的ul时，我的内容必须变得可见。

但是我缺少了一些东西，当我单击时什么也没发生。我不知道为什么会这样。请看一下底部附近提供的小提琴

这是代码：

$(document).ready(function(){ 
    $("ul.topnav > li.one").click(function() {
        $('.content').hide(500).fadeOut(400);
        if ($(this).next().is(':hidden') == true) {
            $(this).next().show(400).fadeIn(500);
        } 
    });

    $('.content').hide();
});

<ul class="topnav">
    <li class="one"><a href="#">test</a></li>
    <li>second</li>
</ul>

<div class="content">Some content here</div>

这是一个小提琴http://jsfiddle.net/2pBge/

黄教

干得好

http://jsfiddle.net/Mc92M/1/

$(document).ready(function(){ 
    $("li.one").on("click", function() {

        $('.content').fadeOut(400);
        if ($('.content').is(':hidden')) {
            $('.content').fadeIn(500);
        } 
    });

    $('.content').hide();
});

使用时，.next()它的目标是第二个li，而不是内容div，因此没有显示或隐藏任何内容。我还删除了.hide和，.show因为您已经淡入/淡出了

如果您真的想使用，.next()那么您就必须做

$(document).ready(function(){ 
    $(".topnav").on("click", function(e) {

        if( $(e.target).parent().is('li.one') ) {
            $(this).next().toggle();
        }
    });

    $('.content').hide();
});

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。