我正在創建自定義計算機建築,但我正在努力更新總價格。Jquery選擇數據價格所有選中的複選框並將它們加在一起
用戶選擇他們想要的處理器,並使用data-price
添加到價格上。
這裏是我的HTML
<div class="process_intel_options" style="display:block">
<label class="option">
<input type="radio" name="processor_options" value="i7950" data-price="155" id="intel_options_0" checked="checked" />
Intel Core i7 950 3.06Ghz
</label>
<br />
<label class="option">
<input type="radio" name="processor_options" value="i7960" data-price="250" id="intel_options_1" />
Intel Core i7 960 3.20Ghz
</label>
</div>
<div class="process_amd_options" style="display:none">
<label class="option">
<input type="radio" name="processor_options" value="i7950" data-price="150" id="amd_options_0" />
AMD Core i7 950 3.06Ghz
</label>
<br />
<label class="option">
<input type="radio" name="processor_options" value="i7960" data-price="352" id="amd_options_1" />
AMD Core i7 960 3.20Ghz
</label>
</div>
而且我的JavaScript,我很新成JavaScript,所以藉口任何錯誤小學生!
var base_price = 300;
$("#final_price").html(base_price);
$("*").click(function() {
// Update price
// Select all checked
$(":checkbox").each(function(index) {
// Select all checked and with a price
$(this).data("price").each(function(index) {
// Add the prices
base_price += $(this).data("price");
});
});
$("#final_price").html(base_price);
});
它循環的原因是因爲用戶可以選擇顯卡,主板等從無線電(或複選框)列表。
這裏是我住exmple:http://genyx.co.uk/CCB/
請注意,只有處理器目前對他們data-price
。
一定要加上「如果(購買者== 「MarkSchultheiss」)搶購價格=價格/ 4;!:) – 2012-02-16 13:29:35
哈哈好吧,我會看到我能做些什麼 – Adam 2012-02-16 13:38:56