时间戳

首页 > 解决方案 > Woocommerce：未触发交付方法更改事件处理程序

javascript - Woocommerce：未触发交付方法更改事件处理程序

问题描述

我的 HTML 代码（单选按钮的交付方法列表）是：

<ul id="shipping_method" class="woocommerce-shipping-methods">
    <li>
        <input type="radio" name="shipping_method[0]" data-index="0" id="shipping_method_0_local_pickup8" value="local_pickup:8" class="shipping_method" checked="checked"><label for="shipping_method_0_local_pickup8">Local pickup</label>
    </li>
    <li>
        <input type="radio" name="shipping_method[0]" data-index="0" id="shipping_method_0_edostavka-package-door-stock7138" value="edostavka-package-door-stock:7:138" class="shipping_method"><label for="shipping_method_0_edostavka-package-door-stock7138">Postamat: <span class="woocommerce-Price-amount amount">265&nbsp;<span class="woocommerce-Price-currencySymbol">₽&lt;/span></span></label>
    </li>
    <li>
        <input type="radio" name="shipping_method[0]" data-index="0" id="shipping_method_0_flat_rate1" value="flat_rate:1" class="shipping_method"><label for="shipping_method_0_flat_rate1">Courier delivery <span class="woocommerce-Price-amount amount">350&nbsp;<span class="woocommerce-Price-currencySymbol">₽&lt;/span></span></label>
    </li>
</ul>

它不能改变（Woocommerce HTML 生成）。至少我不想改变它。

我的任务是在选择更改事件上添加 Javascript 处理程序：

jQuery(document).ready(function($){
    let methods = jQuery('.shipping_method’);
    methods.each(function(index) {
        $(this).bind('change', function() {
            alert('Change event fired for ' + this.val());
        });
    });
});

当交付方法（类 == 'shipping_method' 的单选按钮）更改时，不会触发处理程序。

整个收音机列表的更改处理程序也不起作用：

methods.bind('change', function() {
    alert(this.val());
});

怎么了？

标签： javascriptjquerywoocommerce

解决方案

推荐阅读