获取由选择框动态更改的跨度值

Get value of span that is dynamically changed by a select box

本文关键字：选择 动态 获取      更新时间：2023-09-26

我有一个电子商务网站，其中包含商品详情页面上每个商品的 SKU <span>，如下所示：

<span class="VariationProductSKU">052077</span>

当客户在以下<select>菜单中选择尺寸时...

<div class="productOptionViewSelect">
     <select id="4ab0094cccc675de3daaa83d6b1819e2" class="validation" name="attribute[110]">
          <option selected="selected" value=""> -- Please Choose an Option -- </option>
          <option value="69">S</option>
          <option value="70">M</option>
          <option value="71">L</option>
          <option value="72">XL</option>
          <option value="73">XXL</option>
     </select>
</div>

<span>标签中显示的 SKU 动态更新如下（在本例中，他们选择了尺码"L"）：

<span class="VariationProductSKU">052077.L</span>

我需要使用 jQuery 获取包含新的动态更新 SKU 的 <span> 标记的值。我已经尝试了以下jQuery代码，但它似乎总是将<span>标签的先前值而不是新值传回给我。

if ($('div.productAttributeList').html() !== ''){
    $("div.productOptionViewSelect select").on( 'change', function () {
         var val = "";
         val = $('span.VariationProductSKU').text().trim();
         alert(val);
    });
}

任何关于如何从<span>标签中获取正确值的见解将不胜感激！

尝试稍等片刻，让远程脚本完成：

if ($('div.productAttributeList').html() !== '') {
    $("div.productOptionViewSelect select").on('change', function () {
        var val = "";
        setTimeout(function() {
            val = $('span.VariationProductSKU').text().trim();
            alert(val);
        }, 50); // adjust this value until it's working reliably
    });
}
相关文章：