你遇到的核心问题是sessionStorage里存储的Type1和Type2已经带上了完整的QueryString前缀（比如/?id=na&val1=），直接拼接就会导致参数重复堆叠。咱们一步步来修复：

1. 先修正sessionStorage的存储逻辑 #

首先要确保你存在sessionStorage里的只是val1和val2的纯值，而不是带QueryString的完整片段。修改你的存储代码：

$("#Type").change(function () {
  // 只存储选中的纯值，去掉多余空格，不要带任何url前缀
  sessionStorage.setItem("Type1", $(this).val().trim());
  // 同理，Type2的存储也要确保是纯值（比如对应另一个选择器的话）：
  // sessionStorage.setItem("Type2", $("#AnotherType").val().trim());
});

2. 用安全的方式构建QueryString #

直接拼接字符串容易出错，推荐用URLSearchParams来构建参数，它会自动处理编码和参数覆盖（避免重复）：

$("#Type").change(function () {
  sessionStorage.setItem("Type1", $(this).val().trim());
  
  // 初始化参数对象，可基于当前页面已有query参数（可选保留原有值）
  const params = new URLSearchParams();
  // 设置或更新目标参数，重复设置会自动覆盖旧值
  params.set('id', 'na');
  params.set('val1', sessionStorage.getItem("Type1"));
  params.set('val2', sessionStorage.getItem("Type2"));
  
  // 拼接成最终url并跳转
  location.href = `/?${params.toString()}`;
});

这个方法的优势：

• 自动处理特殊字符的URL编码
• 如果参数已存在，set方法会直接覆盖旧值，不会出现重复
• 代码结构更清晰，不容易出错

3. 清理旧的错误存储值 #

如果之前已经存了带前缀的错误值，记得先清空sessionStorage避免干扰：

// 可以在浏览器控制台执行，或者临时加在代码开头（执行一次即可）
sessionStorage.removeItem("Type1");
sessionStorage.removeItem("Type2");

这样修改后，生成的QueryString就会是你期望的?id=na&val1=ring&val2=Gold啦。

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