gpt4 book ai didi

javascript - 检测 URL 更改,无需哈希或后退/前进 popstate

转载 作者:行者123 更新时间:2023-12-02 23:01:35 26 4
gpt4 key购买 nike

TLDR;

我有一个 URL,其结尾位会根据选项选择更改而更改:

www.mywebsite.com?variant=13390743207991

?variant=13400659984439

我想知道是否有办法检测这种变化。我已经能够使用 setInterval 来做到这一点,并且只需每隔 0.5 秒抓取一次 URL 即可检测更改,但是还有比这更有效的方法吗?

完整故事

我对 javascript 领域还很陌生,所以如果我错了,请纠正我。

我正在为 Shopify 网站开发一些工作。据我所知,Shopify 为特定产品提供了一个产品变体选择器,其中会动态填充并更改所选产品和产品价格。

将新类添加到选择表单后,我意识到它们在创建时会自动删除,这使得我很难检查是否选择了新选项。它的一个例子看起来像这样:

 <select name="id"  id="productSelect-{{ product.id }}" class="product-single__variants">
{% for variant in product.variants %}
{% if variant.available %}
<option {% if variant == current_variant %} selected="selected" {% endif %} value="{{ variant.id }}" data-sku="{{ variant.sku }}">{{ variant.title }}</option>
{% else %}
<option>
{{ variant.title }} - {{ 'products.product.sold_out' | t }}
</option>
{% endif %}
{% endfor %}
</select>

我创建了一个实用程序来检测用户访问者的地理位置,以相应地调整产品的价格(美元、加元等)。

考虑到我无法检测变体是否在 Shopify 的气泡之外发生了更改,因此一旦变体发生变化,我就无法调整显示的价格。它最初是通过液体代码中的赋值变量进行调整的。

但是,我确实注意到,页面的 URL 在变体更改时发生变化:

?variant=13390743207991

?variant=13400659984439

这个额外的位被标记在 URL 的末尾。

我想知道是否有任何方法可以检测此 URL 更改,这样我就可以在选择变体时调整价格。

最佳答案

如果您使用默认的 Shopify 脚本,请使用它们提供的回调。更多信息here .

  var selectCallback = function(variant, selector) {
// do stuff
}

new Shopify.OptionSelectors('product-variant-selector', {
product: {{ product | json }},
onVariantSelected: selectCallback,
enableHistoryState: true
});

关于javascript - 检测 URL 更改,无需哈希或后退/前进 popstate,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57762125/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com