Jquery没有按类获取元素[重复]

Question

希望你做得很好:)

我正在尝试制作滚动动画，并且我在本地 jquery.js 文件中有此代码：

$(() => { 

  /*  Components */

  $(".navbar_section").load("../components/navbar.html");
  $(".title_section").load("../components/title.html");
  $(".welcome_section").load("../components/welcome.html");
  $(".trust_section").load("../components/trust.html");
  $(".menu_section").load("../components/menu.html");
  $(".parallax_section").load("../components/parallax.html");
  $(".location_section").load("../components/location.html");
  AOS.init();

  /*  Animations */

  $(function () {
    var pizzaLeft = $(".pizza-menu-left");
    $(window).on("scroll", () => {
      var scroll = $(window).scrollTop();
      if (scroll >= 1500) {
        pizzaLeft.removeClass("roll-out-left");
        return pizzaLeft.addClass("roll-in-left");
      } else {
        pizzaLeft.removeClass("roll-in-left");
        return pizzaLeft.addClass("roll-out-left");
      }
    });
  });
});

问题是，.pizza-menu-left 没有被选中，但上面的所有类都选中了。我已经尝试过，live()，on()，但似乎没有任何效果。我知道这都是关于创建 DOM 对象和属性的时间，当然，上面的函数是在设置类属性之前运行的。不过，我不知道如何解决这个问题。

Answer 1

假设.pizza-menu-left 是动态加载的元素，当 onload 函数运行时它们将不可用，因此您需要在事件处理程序内部定义该变量。

$(function () {
    $(window).on("scroll", () => {
      var pizzaLeft = $(".pizza-menu-left");
      var scroll = $(window).scrollTop();
      if (scroll >= 1500) {
        pizzaLeft.removeClass("roll-out-left");
        return pizzaLeft.addClass("roll-in-left");
      } else {
        pizzaLeft.removeClass("roll-in-left");
        return pizzaLeft.addClass("roll-out-left");
      }
    });
  });