使用选择选项文本更改价格

时间:2013-10-15 13:44:51

标签: javascript jquery cart

我使用的是Cart66,直到用户查看购物车后才会改变购物车的价格。我需要一种方法来改变当前项目的价格,以便用户知道价格已经改变。我认为这可以使用jquery / js完成,但无法弄清楚如何。

根据“cart66-select”选项文本“()”中的值增加/降低“cart66-price-value”的价格。

<script class="cart66-select">
<option value="A">Coral</option>
<option value="B">Passion Fruit (+5.00)</option>
</script>
<strong class="cart66-price-value">$24.00</strong>

2 个答案:

答案 0 :(得分:0)

<select class="cart66-select">
    <option value="A" price="10">Coral</option>
    <option value="B" price="5">Passion Fruit (+5.00)</option>
</select>
<strong class="cart66-price-value">$<span id="price">24.00</span></strong>


<script type="text/javascript">
    jQuery(document).ready(function(){
        jQuery(".cart66-select").change(function(){
            var price = parseInt(jQuery(this).find(':selected').attr('price')).toFixed(2);
            jQuery("#price").html(price);
        });
    });
</script>

答案 1 :(得分:0)

可以使用jQuery yes @Aaron完成。查看<{3}}做了

<select class="cart66-select">
    <option value="$24.00">Coral</option>
    <option value="$29.00">Passion Fruit (+5.00)</option>
</select>
<strong class="cart66-price-value">$24.00</strong>

var changePrice = function()
{
    var select = $(".cart66-select"),
        displayPrice = $(".cart66-price-value");

    select.change(function(){
        var selected = $(this).children("option:selected").val();
        displayPrice.text(selected);
    });
}

changePrice();