需要 "add to cart" 按钮价格才能更新为正确的金额，具体取决于选中的复选框

Question

这是我的html一次性价格

    <label for="autodeliver_off_radio_{{product.id}}" id="auto_deliver_label">
        <input type="radio" name="autodeliver_{{product.id}}" class="autodeliver {{product.id}}" value="onetime" {% if subscription_only == 'false' %} checked="" {% endif %} id="autodeliver_off_radio_{{product.id}}"> <span class="label_background"></span>
        <span style="color:black;">ONE-TIME PURCHASE </span> <span id="one-time-price_{{product.id}}"></span>
        <br>
        <span class="one_time_product_price"> {{ product.price | money }}</span>
    </label>

这是我的订阅价格代码

    <label for="autodeliver_on_radio_{{product.id}}" id="auto_deliver_label" style="font-weight:bold;">
          <hr style="margin-top:-5px;border-top: 1px solid #000;">
          <input type="radio" name="autodeliver_{{product.id}}" class="autodeliver {{product.id}}" value="autodeliver" {% if subscription_only == 'true' %} checked="" {% endif %} id="autodeliver_on_radio_{{product.id}}"><span class="label_background"></span>
          <span style="color:black;"> SUBSCRIBE 
          {% if discount_percentage != 0 %}
            AND SAVE</span> 
          <span>{{discount_percentage}}%</span> <span id='recurring-time-price_{{product.id}}'></span><br><span class="subscribe_product_price">{{product.price | divided_by: new_num_2 | money }}</span> {% endif %}
    </label>

这是需要更新价格的地方

       <div class="add-to-cart__wrapper">
          <button type="submit" name="add" id="AddToCart" class="btn btn--large btn--full btn--clear uppercase">
            <span id="AddToCartText">{{ 'products.product.add_to_cart' | t }} </span>
            <span class="unicode">&#x2022</span>
            <span class="add-to-cart__price money"><span id="ButtonPrice">{{ product.price | money }}</span></span>
          </button>
        </div>

我希望有一个简单的 jquery 解决方案，但我似乎无法得到它。一直试图从复选框旁边提取 html 值并更新添加到购物车按钮，但没有成功。真的很难过，提前谢谢！我添加了视觉效果以防混淆

Answer 1

试试这个 jQuery 代码：

$(function(){
    var buttonPrice = $('span#ButtonPrice');

    $('input[type="radio"].autodeliver').click(function(){
        _this = $(this);

        if ( _this.attr('value') === 'onetime' ) {
            buttonPrice.html( $('span.one_time_product_price').html() );
        } else if ( _this.attr('value') === 'autodeliver' ) {
            buttonPrice.html( $('span.subscribe_product_price').html() );
        };
    });
});

需要 "add to cart" 按钮价格才能更新为正确的金额，具体取决于选中的复选框

Need "add to cart" button price to update with correct amount depending on what checkbox is checked

javascript

ruby

jquery

liquid

shopify