Question

就像标题所说的那样！我有这个div出现在滚动上，我有代码，但我希望动作只发生一次。如果我决定关闭div（它是一个警报）并再次向下滚动，则不会再发生。我怎样才能做到这一点？

我已经阅读了我能找到的所有内容，但由于我是新手，所以对我来说理解起来太困惑了。

无论如何，到目前为止，这是我的代码：

$(document).scroll(function () {
    var y = $(this).scrollTop();
    if (y > 100) {
        $('#alert').fadeIn();
    } 
});

我需要添加什么？谢谢！

Answer 1

如果您设置了一个标志变量以查看它是否已设置。我使用.data来避免变量名称冲突。

＆＃13;

$(document).scroll(function () {
    var y = $(this).scrollTop();
    if (y > 100 && !$(this).data("once")) {
        $('#alert').fadeIn();
        $(this).data("once", true);
        console.log("invoked once");
    } 
});

＆＃13;

body {
  height:700px;
}
#alert {
  bottom:70px;
  position:fixed;
  display:none;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="alert">test</div>

＆＃13;

Answer 2

您可以创建一个返回true或false的变量，例如：

$(document).scroll(function () {
    var y = $(this).scrollTop();
    var scrolled = false;
    if (y > 100 && !scrolled) {
        scrolled = true;
        $('#alert').fadeIn();
    } 
});

只在滚动上显示div一次

2 个答案: