Question

 <ol class="novice">
<li>
    <p class="glava">HTML</p>
    <div class="vsebina">
        <p>Hyper Text Markup Language (slovensko jezik za označevanje nadbesedila...</p>
    </div>

</li>
<li>
    <p class="glava">CSS</p>
    <div class="vsebina">
        <p>Cascading Style Sheets (kratica CSS) so predloge, ki določajo izgled ...</p>
    </div>
</li>

当我点击p class="glava"时，我希望显示此div中的特定li（.show()）和所有其他div li s）是隐藏的。我有大约十$("p.glava").click(function () { $(something).show(); //$(everything else ).hide();。

IN

Answer 1

使用幻灯片切换动画

$(".glava").click(function () {
    $(this).closest('li').find('.vsebina').slideToggle('slow');
});

使用淡入淡出切换动画

$(".glava").click(function () {
    $(this).closest('li').find('.vsebina').fadeToggle('slow');
});

只是为了隐藏

$(".glava").click(function () {
    $(this).closest('li').find('.vsebina').hide();
});

Answer 2

遍历以隔离特定实例的多种方法。所有这些都以this作为被点击的类的元素实例开始

$("p.glava").click(function () {
   $('.vsebina').hide();

   $(this).parent().find('.vsebina').show()
   // or
   $(this).next('.vsebina').show()  
   // or
   $(this).siblings('.vsebina').show()  
}) ;

参考

无法显示和隐藏div

2 个答案: