提问人：Sergei 提问时间：6/23/2023 更新时间：6/24/2023 访问量：50
每次滚动到事件时仅触发一次事件
Triggered event only once every time it is scrolled to
问：
我有一些事件，当用户滚动到元素«itemSection1»时。但是此事件将重复多次，因为用户将继续滚动，直到此元素完成。如何使事件在每次滚动到时仅触发一次？
当我下次到达这个元素时，我再次需要这个事件
$(window).scroll(function() {
if ($(this).scrollTop() >= $('.itemSection1').offset().top - 150) {
$('.scrollLinks a').removeClass('active');
$('.menuItem1').addClass('active');
alert('Hello!'); // some event that i need only once on reaching
} else {
$('. menuItem1').removeClass('active');
}
});
答：
0赞
user2314737
6/24/2023
#1
您希望在滚动后触发某些操作，但仅在达到特定偏移量时触发。因为在通过某个 treshold 后，你添加了 类 ，你可以使用该信息。"active"
检查元素是否已经具有类"active"
// add class etc only if not already added
if (!($("p").hasClass("active"))) {
$(document).ready(function() {
$(window).scroll(function() {
if ($(window).scrollTop() >= 5) {
// add class etc only if not already added
if (!($("p").hasClass("active"))) {
$("p").addClass("active");
$('.scrollLinks a').removeClass('active');
$('.menuItem1').addClass('active');
alert('Hello!'); // some event that i need only once on reaching
}
}
else {
$('p').removeClass('active');
}
})
});p {
background: green;
height: 1300px;
width: 100%;
}
.active {
background-color: red;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p>Scroll down this page.</p>
评论