时间戳

首页 > 解决方案 > 加载新类别后 Javacsript 无法正常工作

javascript - 加载新类别后 Javacsript 无法正常工作

问题描述

我在 Prestahop 的 1.7 custom.js 文件中添加了一些 JavaScript 代码，因为我想在悬停时更改类别产品的 div 的类。该代码有效，但如果我加载下一个类别或从分层导航中选择任何过滤器，则代码将停止工作，并且仅在我重新加载页面时才有效。我想这与加载结果和下一个类别的 Ajax 调用有关，但我对 JavaScript 不是很好。关于在加载新类别或过滤结果后如何使代码工作的任何想法？任何帮助将不胜感激。

$(".product-box").hover(function(){
    $(this).addClass("current");
},function(){
    $(this).removeClass("current");
});

标签： javascriptprestashopprestashop-1.7

解决方案

就像 DustInCompetent 提到的，如果只是添加一些 css 样式给它，你可以通过使用.product-box:hover.

如果你也想做 JS 的东西，那么.product-box很可能是动态加载的。因此，您的 .hover 函数不适用于添加到 DOM 的新元素。你可以使用这样的东西：

$(document).on({
    mouseenter: function () {
        //stuff to do on mouse enter
    },
    mouseleave: function () {
        //stuff to do on mouse leave
    }
}, ".product-box"); //pass the element as an argument to .on

推荐阅读