在jQuery中跨越一个范围内的图像

时间:2013-11-26 09:56:52

标签: jquery

所以我正在做一个下拉列表:

<section class="services-list">



<a><h3>Extension Building</h3><span></span></a><p>Pellentesque habitant morbi tristique     senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat     vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper.     Aenean ultricies mi vitae est. Mauris placerat eleifend leo.</p>

<a><h3>Conversion Specialising</h3><span></span></a><p>Pellentesque habitant morbi     tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam,     feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas     semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.</p>

</section>

段落为display:none,单击a标签后可见。我有这个工作正常,所以只显示下一段而不是全部。但是,我还在span标记中有一个向下箭头,表示单击时会出现下降。我使用.minimise类在css中旋转该跨度,所以我想要的是在单击a标签时将类添加到特定范围,使箭头指向上方以显示p可以再次隐藏。我已经在jQuery中切换了类,但它在所有跨越而不是在特定的标记中切换类。

这是我目前的jQuery:

 $(".services-list a").click(function(){
        $(this).next('services-list a span').toggleClass("minimise");
        $(this).next("p").stop('true','true').slideToggle("fast");

    });

希望一切都有意义!谢谢你的时间。

1 个答案:

答案 0 :(得分:1)

您要定位的span是所点击的a元素的后代,因此请使用.find()

$(".services-list a").click(function () {
    $(this).find('span').toggleClass("minimise");
    $(this).next("p").stop(true, true).slideToggle("fast");
});

演示:Fiddle