JQuery从选定的下拉菜单中获取选定的值并将其添加到总数

Question

我将如何开始，我想选择每个选中的“[]”中包含的值并将其添加到#theFinalPrice？

<div ID="theFinalPrice">$20.00</div> 

<p>Hotel:<br /> 
<select name="variation1" class="eStore_variation"> 
<option value="King Bed [+ $50.00]">King Bed</option> 
<option value="Double Bed">Double Bed</option> 
</select></p> 

<p>Add a Guest:<br /> 
<select name="variation2" class="eStore_variation"> 
<option value="no added guests">no added guests</option> 
<option value="+1 guest [+ $35.00]">+1 guest [+ $35.00]</option> 
</select></p> 

<p>Additional Fun:<br /> 
<select name="variation3" class="eStore_variation"> 
<option value="no additional fun">no additional fun</option> 
<option value="1 game of golf [+ $35.00]">+1 game of golf [+ $35.00]</option> 
</select></p> 

Answer 1

在你喜欢的任何变化，或单击处理程序，您可以使用jQuery的each获得，总结所有的值：

var total = 0; // Set to some base price 

$('.eStore_variation option:selected').each(function() { 
    var m = /\[\+ \$(\d+\.\d+)\]/.exec(this.value); 

    if(m !== null) { 
     total += +m[1]; 
    } 
}); 

var decimalPart = (total - Math.floor(total)) * 100; 

$('#theFinalPrice').text('$' + Math.floor(total) + '.' + (decimalPart < 10 ? '0' : '') + decimalPart); 

Here's a demo jsFiddle.