Question

我正在尝试使用simplecart为选择框中选择的每个尺寸图像设置价格。我为每个图像选择了一个框来设置如下：

<img class="item_image" src='my.jpg' height='50' width='50' alt="Mine"/>
<span class="item_name">My image</span>

<select class="item_size" >
<option value="5 x 7" data-price="5.00">5 x 7 - <span>$ 5.00</span></option>
<option value="8 x 10" data-price="10.00">8 x 10 - <span >$ 10.00</span></option>
<option value="16 x 20" data-price="20.00">16 x 20 - <span>$ 20.00</span</option>
</select>
<input type="text" class="item_quantity"  title="Item Quantity" value="1"/>

我在为每个项目选择选项选项值时，尝试使用data-price属性设置价格：

 simpleCart.bind( 'beforeAdd' , function( item ){

$('select').each(function(){ 
  var selected = $(this).find('option:selected');
    var extra = selected.data('price'); 
     item.price(extra);
  });
  });

我是一个菜鸟，所以我不太适应它。我可以获得第一个图像价格设置，但不能在其他选择框中。我可以为每个选择框使用单独的ID，但也不确定如何执行此操作。任何帮助将不胜感激！

Answer 1

您可以在更改选择框时更新单独的item_price字段。

<img class="item_image" src='my.jpg' height='50' width='50' alt="Mine"/>
<span class="item_name">My image</span>

<select class="item_size">
<option value="5 x 7" data-price="5.00">5 x 7 - <span>$ 5.00</span></option>
<option value="8 x 10" data-price="10.00">8 x 10 - <span >$ 10.00</span></option>
<option value="16 x 20" data-price="20.00">16 x 20 - <span>$ 20.00</span</option>
</select>
<!-- new input --><input type="text" class="item_price" value="5.00"/>
<input type="text" class="item_quantity"  title="Item Quantity" value="1"/>

然后，你可以在JS

中做到这一点

$('.item_size').on('change', function(){

    var $this = $(this),
        selected = $this.find(':selected').data('price')

    $this.siblings('.item_price').val(selected);

});

http://jsfiddle.net/Kvkh5/

上的工作示例

不要忘记将该新字段更改为“隐藏”字段，我将其设为文本字段仅用于演示目的。

Answer 2

您可以这样做（在Simplecart网站上显示）：

simpleCart.bind( 'beforeAdd' , function( item )
{
    if( item.get( 'size' ) == '15 x 10 cm' )
    {
        item.price( '2' );
    }
    else if( item.get( 'size' ) == '15 x 21 cm' )
    {
        item.price( '3' );
    }
    else if( item.get( 'size' ) == '21 x 29,7 cm' )
    {
        item.price( '5' );
    }
    else if( item.get( 'size' ) == '21 x 29,7 cm encadré' )
    {
        item.price( '20' );
    }
});

但它不适用于8.如果有人知道为什么？

Jquery选择选项，使用Simplecart-js中的数据属性

2 个答案: