Question

这是HTML

<a style="border: medium none; display: block;" class="agendaNav" href="#"><img class="rightArrow" src="/images/arrowdown.png"> WEEK AT A GLANCE</a>

<div class="agendaDay">

  Content In Here

</div>

相同的链接/类重复多次，我使用以下JQuery：

$('.agendaNav').click(function(event){
    event.preventDefault();
    if($(this).find('.rightArrow').attr('src')=='/images/arrowdown.png'){
        $(this).find('.rightArrow').attr('src', '/images/arrowright.png');
        $(this).attr('style', 'border-bottom: 1px solid #fff; display: block;');
    } else {
        $(this).find('.rightArrow').attr('src', '/images/arrowdown.png');
        $(this).attr('style', 'border: none; display: block;');
    }
    $('.agendaDay').toggle('fast');
});

如果你看看这里：

http://icuc2011.com/agenda

你会看到它改变了每一类有意义的agendaDay，但我只想在点击的'a'标签之后直接更改一个，我试过这个：

$(this).next('.agendaDay').toggle('fast');

但是随后箭头发生了变化，但是课堂议程日的内容根本没有变化，我做错了什么？

Answer 1

您的示例与您的实际代码不符。在您的代码中，链接位于p标记内。 div是此p标记后的兄弟。如果这始终如一，那么你想要：

$(this).parent().next('.agendaDay').toggle();

在Jquery中定位下一个Div元素

1 个答案: