如何让Elementor Pro portfolio widget的第二个列表项处于激活状态

数据老陈

2026-10-1

Elementor Portfolio 默认选中第二个筛选项解决方案

你当前代码失效的核心原因有两个：一是仅添加了激活样式类，没有触发Elementor绑定在筛选项上的筛选逻辑，二是代码执行时Elementor Portfolio组件大概率还未完成初始化，选择器无法匹配到对应元素。

方法1：带延时的DOM加载后执行（上手简单）

直接把以下代码添加到站点全局自定义JS区域，或对应页面的自定义JS配置框中即可：

jQuery(document).ready(function($) {
    // 延时等待Portfolio组件初始化完成
    setTimeout(function() {
        const targetFilter = $('.elementor-portfolio__filters li:nth-child(2)');
        if (targetFilter.length) {
            // 同时添加激活类 + 触发点击事件执行筛选逻辑
            targetFilter.addClass('elementor-active').trigger('click');
        }
    }, 300); // 可根据站点加载速度调整延时，100-500ms区间都可尝试
});

方法2：使用Elementor官方前端钩子（更稳定）

如果方法1偶尔出现失效的情况，可以换用Elementor自带的组件加载监听钩子，不需要手动调整延时，兼容性更强：

jQuery(window).on('elementor/frontend/init', function() {
    elementorFrontend.hooks.addAction('frontend/element_ready/portfolio.default', function($scope) {
        const targetFilter = $scope.find('.elementor-portfolio__filters li:nth-child(2)');
        if (targetFilter.length) {
            targetFilter.addClass('elementor-active').trigger('click');
        }
    });
});