如何固定URLSearchParams指定参数 解决代码导致的页面无限加载问题

问题原因 #

你写的代码没有对当前URL的参数状态做判断，页面每次加载完成都会无条件触发跳转，跳转后的新页面又会再次执行相同的JS逻辑，最终形成无限重定向的死循环。

修复后代码 #

<input name='penalty' value='365' hidden>
<script>
 $(document).ready(function() {
  // 直接获取URL查询参数部分，兼容无查询参数、带锚点的场景
  const paramspenalt = new URLSearchParams(window.location.search);
  const targetPenalty = $('input[name=penalty]').val();
  const currentPenalty = paramspenalt.get('penalty');

  // 仅当参数不符合预期时才执行跳转
  if (currentPenalty !== targetPenalty) {
    paramspenalt.set('penalty', targetPenalty);
    window.location = `action.php?${paramspenalt.toString()}`;
  }
 });
</script>

改动说明 #

• 用window.location.search获取查询参数，比手动拆分整个href更稳妥，不会受URL锚点、路径中特殊字符的影响
• 新增参数校验逻辑：如果当前penalty参数已经和input预设值一致，不会执行跳转，直接终止逻辑，彻底解决重复加载问题
• 保留了你原有功能逻辑，参数不符合要求时仍然会自动重置为input设置的数值

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