javascript - Jquery在div中向下滑动一个元素

Question

我有一个这样的div：

<div>
  <font class='slideclick'>Click here to slidedown dynamic content</font>
  <div class='slidedownonclick'> This is the content that slides down </div>
</div>

当单击“slideclick”时，jquery 会触发“slidedownonclick”向下滑动。这很好用，但我在同一个网页中从 mysql 数据库中重复出现这些 div 并且数量不定。给他们唯一的 id 是不可能的。有没有什么办法可以让我在同一个 div 中只获得与其各自的 'slideclick' 相同的 'slidedownonclick' 以在单击时向下滑动。

任何帮助将非常感激，

谢谢，

Answer 1

在.slideclick处理程序上，您会发现该兄弟具有：

$(this).find('+ .slidedownonclick');

或者：

$(this).next('.slidedownonclick');

Answer 2

单击时，这将向下滑动下一个.slidedownonclickdiv .slideclick：

$('.slideclick').click(function() {
    $(this).next('.slidedownonclick').slideDown();
});

Answer 3

$('.slideclick').click(function() {
 $(this).next('.slidedownonclick').animate({
    height: '+=50'
  }, 1000);
});

Answer 4

检查jQuery.next()，这就是你想要的。
使用它，您可以获得下一个兄弟姐妹哪个 class/id 是选择器。
编辑：

直到 jQuery 1.6.4

   jQuery(document).delegate('font.slideclick', 'click', function() {
        jQuery(this).next('slidedownonclick').slideToggle();
    });

jQuery 1.7 +

jQuery(document).on('click', 'font.slideclick', function() {
    jQuery(this).next('slidedownonclick').slideToggle();
});