javascript - 如何在 jQuery 更改事件后获取更新的 URL 参数
问题描述
在 Shopify 中,我试图在脚本文件中获取所选变体的 ID。我能够通过获取 URL 参数来获取 Variant ID,但它给了我在 on change 事件之前存在的 url 参数。
我尝试进行 AJAX 调用,遍历产品变体 ID,但没有运气。
// Getting the URL Parameter for Variant ID
var getUrlParameter = function getUrlParameter(sParam) {
var sPageURL = window.location.search.substring(1),
sURLVariables = sPageURL.split('&'),
sParameterName,
i;
for (i = 0; i < sURLVariables.length; i++) {
sParameterName = sURLVariables[i].split('=');
if (sParameterName[0] === sParam) {
return sParameterName[1] === undefined ? true : decodeURIComponent(sParameterName[1]);
}
}
};
$('#option-color').change(function() {
var currentUrl = getUrlParameter('variant');
var variants = [];
var selected = $(this).val(),
mainImage = jQuery('.main-image img').attr('srcset'),
maxCount = 0;
$('.thumbnail').addClass('thumbnail--hidden');
$('.thumbnail--last').addClass('thumbnail--last');
arr = [];
var addImage = $.each(images, function(i, image) {
var alt = images[i].alt,
url = images[i].url;
if (( alt == selected || url == mainImage) && maxCount < 4) {
$($('.thumbnail img[alt="' + alt + '"]')[maxCount]).parents('.thumbnail').removeClass('thumbnail--hidden');
maxCount++
}
});
我基本上希望能够输出在选择新颜色后变成的变体 ID。
解决方案
在获取当前选择的变体的变体 ID 时,您应该在更改变体的实际元素上设置一个侦听器。所有这些活动元素都会发出一种您可以收听的“更改”事件。当您收到更改事件时,通常您会获得一个要检查的变体,但如果没有,您始终可以查询元素的当前值。
查看 URL 可能是执行此操作的效率最低且最不值得信赖的方法。并非所有主题都将当前变体放在 URL 中,并且正如您所指出的,根据您选择检查和解析该值的时间,它可能不代表您想要的。
所以最安全的方法是检查 DOM 并找出客户选择变体的元素,然后深入挖掘以发现“变化”和后续价值。
推荐阅读
- php - 生成具有多次执行的自动递增字符串
- python-3.x - 使用 python 从 XSD 文件创建特定的 XML 文件
- sockets - Elixir 中的 gen_udp 无法连接到 UDP 套接字
- javascript - 滚动动画的触控支持
- mercurial - 如何在我的最后一次提交中取消提交
- javascript - 如何将 get .pipe takeUntil 和订阅 Angular 中的一个函数与 RxJX 结合起来?
- grails - 在 grailsCentral (http://repo.grails.org/grails/plugins) 中找不到工件 org.grails.plugins:audit-logging:jar:1.1.3
- asynchronous - Ionic 4 存储移除
- r - 在使用非导出函数时将 RMD 文件合并到 R 包中
- swift - 为什么 Apple Watch 的本地通知会延迟?