SimpleCart js - 在选项选择上更改价格

时间:2014-02-12 18:48:40

标签: javascript shopping-cart simplecart

我正在开发一个SimpleCart项目,该项目需要许多可以改变项目价格的选项。每个选项都会向项目的基本价格添加一定金额。例如:

商品基价= $ 10

下拉菜单1:

  • 选项1,2,3添加$ 0
  • 选项4,5,6添加$ 1
  • 选项7,8,9加$ 2

...等等基础价格不同的多个项目中的多个下拉菜单。

simplecartjs.org文档建议使用beforeAdd事件,例如:

simpleCart.bind( 'beforeAdd' , function( item ){
if( item.get( 'size' ) == 'Small' ){
item.price( 10 );
} else if( item.get( 'size' ) == 'Large' ){
item.price( 12 );
}
});

您如何使用与此相似的内容将特定金额添加到基本价格而不是为每个选项定义设定价格?

以下是一些简化的示例HTML代码(我的项目实际上在一个下拉列表中有70多个选项):

<div class="simpleCart_shelfItem">
<h2 class="item_name">item</h2>
<select class="item_size">
<option value="small">small</option>
<option value="medium">medium</option>
<option value="large">large</option>
</select>
<select class="item_length">
<option value="short">short</option>
<option value="long">long</option>
</select>
<input value="1" class="item_Quantity" type="text">
<span class="item_price">$10</span>
<a class="item_add" href="javascript:;">add to cart</a></p>
</div>

1 个答案:

答案 0 :(得分:0)

我可能会像提供的文档一样使用它,但添加使基本价格成为可用于增加额外成本的变量。在函数内部应用变量将使其保持本地化,因此如果您在另一个函数中有基本价格,它将不会打扰代码。

*注意我没有测试它,只想到我会怎么做。

simpleCart.bind('beforeAdd', function (item) { var basePrice = 10; if (item.get('size') == 'Small') { item.price(basePrice + 2); } else if (item.get('size') == 'Large') { item.price(basePrice + 2); } else if (item.get('size') == 'Long' && item.get('otherProperty')) { item.price(basePrice + 9); } });