Javascript 页面滚动后的jQuery slideUp错误

我在jQuery的slideUp和slideDown函数中遇到了一些问题。如果你去这个网站

然后点击其中一个框，它通常工作正常，但在你滚动页面并加载更多框后，幻灯片功能会出现错误，如果你明白我的意思，会无缘无故地重复两次

这是我在某个地方做错了什么，还是一个已知的错误

谢谢

代码如下：

var state = 'down';

$('.overlay').click(function() {

     if(state == 'down') {
         $(this).next().slideDown(155);
         state = 'up';
     } else {
         $(this).next().slideUp(150);
         state = 'down';
}

---

。叠加是每个框顶部的透明div

您应该这样做：

html:

css:

或者像这样对孩子说：

---

您不能在需要记录其特定状态的许多元素之间共享单个变量

状态

。相反，您必须保持每个元素的状态。

在ajax成功回调之外定义

单击事件，如下所示（使用更好的选择器，即
body
，仅此示例）

你真的需要发布你的代码，否则我们不知道直接的问题是什么。你的网站上的代码不同。Infinitysroll.js，第50行：代码调用了两次。哦，对了，我现在已经将最新的代码上传到了网站。使用Infinitysroll时出现问题，请检查代码的那部分。似乎事件的定义不止一个。使用on（）jQuery函数在动态创建的玩偶上添加事件感谢您的回复，我第一次使用了slideToggle，但遇到了相同的问题，所以我认为切换到slideUp和slideDown可以解决问题，但遗憾的是，这两种方法都存在问题。不再出现bug了！多谢各位
<div class="something">
    <div class="bar">

    </div>
</div>​

$(function() {
    $('.something').click(function() {
        $('.bar').slideToggle();
    });
});​

.something{
    width: 500px;
    height: 500px;
    border: 1px solid red;
}
.bar{
    display: none;
    width: 500px;
    height: 50px;
    background: blue;
}​

$(function() {
    $('.something').click(function() {
        $(this).find('.bar').slideToggle();
    });
});​

$("body").on("click", ".overlay", function(e){
    $(this).next().slideToggle(150);
    $(this).css('background-color', 'rgba(0,0,0,0)');
});