同位素 JS 错误答案

【问题标题】：Isotope JS Error同位素 JS 错误
【发布时间】：2015-09-11 23:46:05
【问题描述】：

需要一些帮助来解决我遇到的 Js 错误：

未捕获的类型错误：$portfolio.isotope 不是函数

//同位素功能 - 过滤器组合功能 $portfolio = $('.portfolio-items'); $portfolio.isotope({ 项目选择器：'li'，布局模式：'fitRows' }); $portfolio_selectors = $('.portfolio-filter >li>a'); $portfolio_selectors.on('点击', function(){ $portfolio_selectors.removeClass('active'); $(this).addClass('active'); var selector = $(this).attr('data-filter'); $portfolio.isotope({ filter: selector }); 返回假； });

【问题讨论】：

在您运行此脚本之前是否已加载同位素？
是的，同位素已加载。但在页面本身上没有显示错误，仅在没有同位素库的页面上显示。
所以你在不包含任何.portfolio-items 元素的页面上运行这个？
是的...因为 Js 在一个全局脚本中，该脚本链接到所有页面
将您的代码从第 2 行包装到长度检查中：if ($portfolio.length) { ...rest of your code... } 这将阻止它在不包含所需元素的页面上运行

标签： javascript jquery

【解决方案1】：

如果您不希望脚本在不包含所需元素 (.portfolio-items) 的页面上运行，您可以根据存储在 @987654324 中的元素集合的 length 属性有条件地运行脚本@：

$portfolio = $('.portfolio-items');

if ($portfolio.length) { // if 'length' is non zero. Enter block...

    $portfolio.isotope({
        itemSelector : 'li',
        layoutMode : 'fitRows'
    });
    $portfolio_selectors = $('.portfolio-filter >li>a');
    $portfolio_selectors.on('click', function(){
        $portfolio_selectors.removeClass('active');
        $(this).addClass('active');
        var selector = $(this).attr('data-filter');
        $portfolio.isotope({ filter: selector });
        return false;
    });

}

【讨论】：

我遇到了同样的问题，尝试了你的解决方案，但仍然有同样的错误。此错误的其他可能原因是什么？
@SachinVairagi 如果您没有正确加载同位素库，您也会收到Uncaught TypeError: $portfolio.isotope is not a function 错误。检查浏览器开发者工具的网络部分。
感谢您的回复，我提出了新问题并发布了我的代码，请您查看 - stackoverflow.com/questions/52292697/…