0

我正在建立一个 Woocommerce 网站,我想在结帐页面上禁用机车滚动。

我试过这段代码,但它不起作用。如何禁用特定页面的机车?我的网站没有运行 Ajax。

const scroll = new LocomotiveScroll({
    el: document.querySelector('[data-scroll-container]'),
    smooth: true,
    smoothMobile: true,
    getSpeed: true,
    getDirection: true
});


window.addEventListener("load", function() {
     if ($('.woocommerce-checkout').length) {
       scroll.stop();
       scroll.destroy();
     }
  });

谢谢!

4

1 回答 1

0

您可以通过在这样的函数中声明它来阻止 Locomotive Scroll 的初始化:

let scroll;
function initLocoScroll() {
    if (document.querySelector('.woocommerce-checkout')) return;
     scroll = new LocomotiveScroll({
        el: document.querySelector('[data-scroll-container]'),
        smooth: true,
        smoothMobile: true,
        getSpeed: true,
        getDirection: true
    });


  }
    
initLocoScroll();

// if you are concerned that JavaScript will be unable to find the element
// because it is loaded before the DOM,
// you could replace the previous line with this one:

// window.addEventListener("load", initLocoScroll);

我不认为 '.length' 属性是必要的。单独的 jQuery(或 querySelector)语句应该足以确定元素是否存在。

另一个问题可能是找不到您试图用来确定机车卷轴是否应该处于活动状态的元素。如果错误仍然存​​在,请务必检查。

我希望这可以帮到你!

于 2021-12-14T00:08:17.300 回答