Question

我试图在互联网上寻找解决方案，但我还没找到任何有用的东西。
我正在建立一个TwitchTV应用程序（FreeCodeCamp挑战），我想做出类似的东西：如果状态是在线（.online），我可以点击它，一个带有流媒体信息的面板（.slide）将向下滑动，如果我再次点击，那么。
（编辑：
澄清一下：我有一些具有相同类的元素，但是只想定位我点击的兄弟元素。）
问题是，slideToggle上下几次（数量因元素而异），我不知道为什么。我只能猜测它与类和next（）有关：

$(".online").on("click", function() {
    $(this).next(".slide").slideToggle("slow");
});

你可以帮一下吗？是什么导致这个面板像疯了一样上下滑动？你有关于如何使这项工作的一些提示吗？
我的代码是https://codepen.io/Strzesia/pen/PJVjbR/

Answer 1

使用$(this).nextUntil('.slide').next().slideToggle("slow");

＆＃13;

$(".online").on("click", function() {
    $(this).nextUntil('.slide').next().slideToggle("slow");
});

＆＃13;

.slide{width:400px;height:100px;background-color:pink;margin:5px;}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="online">click</div>
<div></div>
<div></div>
<div class="slide"></div>

<div class="online">click</div>
<div></div>
<div class="slide"></div>

＆＃13;

jQuery slideToggle发疯了 - 为什么？

1 个答案: