使用 Javascript 在每次点击时刷新锚标记

Question

我有一个电子商务网站，每次有人点击“添加到托盘”（我们称之为托盘而不是购物车）时，页面都会刷新到同一页面并将其自身定位到该产品的 div（在这里尝试一下： http://www.boostliquidation.com/）。这是使用以下 Javascript 实现的：

 $('input.returnLink').each(function(){
     $(this).attr('value',window.location.href + $(this).attr('data-skuhash'));
     }); 

这个锚标记放置在“添加到购物车”按钮之前的隐藏输入标记中：

<input type="hidden" value="back" name="return_to" class='returnLink' data-skuhash='#{%     for variant in product.variants %}{{variant.sku}}{% endfor %}' /> 

（{% %} 中的代码是 Shopify 网站使用的一种名为 Liquid 的语言）。

这工作得很好......但仅限于第一个产品。它会在地址栏中添加前面带有 # 的 SKU 编号。如果用户添加其他产品，它会刷新到页面顶部，因为它将 SKU 编号修改为地址栏中已显示的现有 SKU 编号。

如何在第一个产品之后添加产品，用自己的 SKU 替换现有的 SKU，以便它们刷新回产品而不是返回页面顶部？

Answer 1

我可能会尝试使用 string.replace()

var str = window.location.href;
var hash = $(this).attr('data-skuhash');

if (str.match('#\w\w+'){
   str.replace('#\w\w+', hash);
} else {
    str = str + hash;
}

查找网址末尾的任何哈希值，如果找到则替换，如果没有则添加。