Question

我说过3组不同的过滤器，如下所示：

<div class="filter1">
<ul>
   <li><a href="javascrript:void(0)" data-param1="1">Some link1</a></li>
   <li><a href="javascrript:void(0)" data-param2="2">Some link2</a></li>
   <li><a href="javascrript:void(0)" data-param3="3">Some link3</a></li>
</ul>
</div>

我需要通过window.location.href onclick动态追加/更新链接的参数

这样的事情：

$('.filter1 li a').on('click',function(){window.location.href += $(this).data('data-param1');})

所以链接将是domain.com/site/filter?param1=1

然后点击另一个过滤器链接后，它将更新为domain.com/site/filter?param1=1&?param2=2

但是，如果单击已经单击的链接，则不应附加但更新参数

我如何通过js / jQuery管理它？或者可能还有其他一种实现该任务的方法？

希望它有意义！

非常感谢提前！

更新：到 badAdviceGuy： 不需要location.hash，链接必须使用一些新的参数将页面导航到新地址。但问题是添加，如果param已经在链接中，则更新当前参数。

Answer 1

如果我理解你的问题，这可能有所帮助。

要在不导航离开当前页面的情况下修改window.location，我喜欢使用window.location.hash。我也可以获得所有的html数据属性。

HTML：

<div class="filter1">
  <ul>
    <li><a href="javascrript:void(0)" data-param="filter1">Some link1</a></li>
    <li><a href="javascrript:void(0)" data-param="filter2">Some link2</a></li>
    <li><a href="javascrript:void(0)" data-param="filter3">Some link3</a></li>
  </ul>
</div>

JS：

$('.filter1 li a').on('click',function(){window.location.hash = $(this).data('data-param');})

Answer 2

$('.filter1 ul li a').on('click',function(e)
{
window.location.href = "domain.com/site/filter?param" + $(this).data('param') + "=" + $(this).data('param');
});

HTML：

<div class="filter1">
<ul>
   <li><a href="javascrript:void(0)" data-param="1">Some link1</a></li>
   <li><a href="javascrript:void(0)" data-param="2">Some link2</a></li>
   <li><a href="javascrript:void(0)" data-param="3">Some link3</a></li>
</ul>
</div>

如何在单击时动态更新链接中的数据

2 个答案: