scroll没有绑定，我被卡住了

oxalkeyp 于 2021-09-13 发布在 Java

关注(0)|答案(2)|浏览(427)

var id  = document.querySelector("#arrowUp");
var arrowUp = window.pageYOffset >= 5;
console.log(arrowUp);
id.classList.toggle("arrowUp", arrowUp);
id.addEventListener('click', function() {
    window.scrollTo(0, 0);      
})

我试图在基于滚动的特定html中插入一个类，但问题是代码的这一部分：

var arrowUp = window.pageYOffset >= 5;

它不会根据滚动和条件动态地变为真或假 window.pageYOffset >= 5; 现在不是动态的true或false。因此，预期的类不会被插入/删除。
如何将这部分代码绑定到scroll事件

JavaScript Offset scroll

来源：https://stackoverflow.com/questions/68333792/scroll-is-not-binded-and-i-am-stuck

2条答案

按热度按时间

rvpgvaaj1#

添加 EventListener 用于滚动事件。

var id = document.querySelector("#arrowUp");

id.addEventListener('click', function() {
  window.scrollTo(0, 0);      
})

window.addEventListener('scroll', function() {
  var arrowUp = window.pageYOffset >= 5;

  if (arrowUp == true) {
    id.classList.add('visible');
  } else {
    id.classList.remove('visible');
  }
})

赞(0）回复(0）举报 2021-09-13

2jcobegt2#

您不能“动态”执行此操作， window.pageYOffset 不是一个神奇的动态变量，它是一个getter（不带参数的函数，用于检索某些值）
为了使其工作，您必须检查每个滚动事件的条件是否为真。

var id  = document.querySelector("#arrowUp");
document.addEventListener("scroll", function() {
  var arrowUp = window.pageYOffset >= 5;
  console.log(arrowUp);
  id.classList.toggle("arrowUp", arrowUp);
});
id.addEventListener('click', function() {
    window.scrollTo(0, 0);      
});

赞(0）回复(0）举报 2021-09-13

我来回答

scroll没有绑定，我被卡住了

2条答案

相关问题

热门标签

最新问答