首页 > 解决方案 > 销毁()的 LightSlider 插件问题

问题描述

我正在使用在 mouseenter 上初始化的 lightSlider 插件,我需要在 mouseleave 上销毁。有时我会遇到这个问题“无法读取未定义的属性‘销毁’”

实际上,如果你可以想象我正在 PLP(产品列表页面)页面上实现它,其中产品网格上有超过 1 个图像。我已经在 StackOverflow 上尝试了各种可用的解决方案,但没有解决我的问题。

var slider,
    slider_config = {
    item: 1,
    loop: true,
    pager: false,
    slideMove: 1,
    adaptiveHeight: true
}
$('#search-result-items').find('.product-tile-container').on({
    mouseenter: function() {
        $(this).addClass('slide-active');
        if ($(this).find('#plpimage-slider').children().length > 1) {
            slider = $(this).find('#plpimage-slider').lightSlider(slider_config);
            //slider.goToNextSlide(100);
        }
    },
    mouseleave: function() {
        $(this).removeClass('slide-active');
        slider.destroy();
        //$('#plpimage-slider').lightSlider('destroy'); // also tried
        //$('#plpimage-slider').data('lightSlider').destroy(true); // also tried
    }
});

此错误显示在浏览器控制台中。需要帮助,所以它不会。

标签: javascriptjquery

解决方案


推荐阅读