JavaScript作品集分类加载异常：点击按钮无法默认显示SPOT TV分类

核心问题分析 #

1. 页面跳转后JS上下文销毁：执行window.location.href跳转时，当前页面的所有JavaScript代码会立即停止运行，后续的setTimeout代码根本不会在新打开的produzioni页面中执行——因为原页面的JS环境已经被销毁。
2. 选择器匹配错误：你用$('.portfolio-category-spot-tv')选择元素，但目标按钮的类是edgtf-pl-filter，portfolio-category-spot-tv只是data-filter属性里的值，并非元素的类名，所以这个选择器无法找到对应按钮。

正确解决方案：通过URL参数传递分类状态 #

这种方式无需依赖不可靠的定时器，而是在跳转时通过URL参数告知目标页面要激活的分类，目标页面加载时读取参数并触发对应操作。

步骤1：修改原页面的按钮点击逻辑

jQuery(document).ready(function($) {
  const produzioniBtn = $('#produzioni-spot');
  
  produzioniBtn.on('click', function(e) {
    // 若按钮是<a>标签，阻止默认跳转行为
    e.preventDefault();
    // 跳转时携带分类参数
    window.location.href = 'http://onemore.corsidigital.org/produzioni/?category=spot-tv';
  });
});

步骤2：在produzioni页面添加参数读取逻辑

在该页面的JavaScript中加入以下代码，用于读取URL参数并激活对应分类：

jQuery(document).ready(function($) {
  // 解析URL查询参数
  const urlParams = new URLSearchParams(window.location.search);
  const targetCategory = urlParams.get('category');
  
  // 若参数为spot-tv，激活对应分类按钮
  if (targetCategory === 'spot-tv') {
    // 通过data-filter属性定位SPOT TV按钮
    const categoriaBtn = $('.edgtf-pl-filter[data-filter=".portfolio-category-spot-tv"]');
    // 设置激活样式并模拟点击
    categoriaBtn.addClass('edgtf-pl-current').siblings().removeClass('edgtf-pl-current');
    categoriaBtn.trigger('click');
  }
});

额外说明 #

• 不要依赖定时器判断页面加载：setTimeout的固定时间无法适配不同设备、网络环境的页面加载速度，这种方式容错性极低。
• 确保选择器准确性：编写选择器时，要区分元素的类名和data-*属性，避免混淆导致选择失败。

内容的提问来源于stack exchange，提问作者Yulian