我的代码大部分都在工作，但是当我尝试在通风选择下添加值时，我的数学不会被添加到最终总数中。它只是显示为文本。我有一个事件应该在选择值3时填充值。但是，只显示文本而不计算任何值。
以下是我的代码。 感谢。
<!-- Working Fiddle, need to add references to javascript/jquery etc. metadata with viewpoint and script name is called calculations.js http://jsfiddle.net/ehhqpybk/ -->
<div data-role="page" id="pageone">
<div data-role="main" class="ui-content">
<h3>Products</h3>
<div data-role="fieldcontain">
<fieldset data-role="controlgroup">
<legend>Product</legend>
<label for="product" class="select">Product</label>
<select id="product" name="product" onchange="if (this.value) window.location.href=this.value">
<option id="select" value="None">Please Select Product</option>
<optgroup label=" Direct Vent Gas Fireplace">
<option id="DXV35_III" value="#pagetwo">DXV-35 DeepTimber Fire III</option>
<option id="DXV45_III" value="#pagethree">DXV-45 DeepTimber Fire III</option>
</optgroup>
</select>
</fieldset>
</div>
<a href="#pagetwo">Go to Page Two</a>
</div>
</div>
<!-- DXV-35 DeepTimber Fire III Direct Vent Fireplace Pricing -->
<div data-role="page" id="pagetwo">
<div data-role="main" class="ui-content">
<div data-role="fieldcontain">
<fieldset data-role="controlgroup">
<legend>Model</legend>
<label for="1">Model</label>
<select id="1" class="vars" name="DXV35_III">
<option value="None" data-price="0">Please Select Model</option>
<optgroup label="Millennia">
<option value="2" data-price="3799">Millennia Black</option>
<option value="2" data-price="3799">Millennia Classic Brass</option>
<option value="2" data-price="3799">Millennia Full Brass</option>
</optgroup>
<optgroup label="Wellington">
<option value="2" data-price="3999">Wellington</option>
</optgroup>
<optgroup label="Andover">
<option value="2" data-price="4399">Doors & Faceplate</option>
</optgroup>
<optgroup label="Prairie">
<option value="2" data-price="4399">Doors & Faceplate</option>
<!-- This will be added once I know what the following values will be <option value="2" data-price="Null">Antique Copper Overlay</option>
<option value="2" data-price="Null">Gold Overlay</option>
<option value="2" data-price="Null">Charcoal Overlay</option>
<option value="2" data-price="Null">Pewter Overlay</option>
-->
</optgroup>
<optgroup label="Deerfield">
<option value="2" data-price="4099">Outside Fit Only</option>
</optgroup>
<optgroup label="Victoria">
<option value="2" data-price="3999">Black</option>
<option value="2" data-price="4199">Gold</option>
</optgroup>
<optgroup label="Tuscany">
<option value="2" data-price="4099">Black</option>
<option value="2" data-price="4199">Gold</option>
</optgroup>
<optgroup label="Bentley">
<option value="2" data-price="4499">Black Arch Screen Doors</option>
<option value="2" data-price="4499">Vintage Iron Arch Screen Doors</option>
<option value="2" data-price="4850">Gold Arch Screen Doors</option>
<option value="2" data-price="4699">Antique Copper Arch Screen Doors</option>
<option value="2" data-price="4699">Gun Metal Arch Screen Doors</option>
<option value="2" data-price="4699">Swedish Nickel Arch Screen Doors</option>
</optgroup>
</select>
</fieldset>
</div>
<div data-role="fieldcontain">
<fieldset data-role="controlgroup">
<legend>Venting</legend>
<label for="1">Venting</label>
<select id="vent" class="vars" name="vent" onchange="if (this.value) = 3 window.location.href=" 15perft ">>
<option value="2 " data-price="0 ">Select Venting</option>
<optgroup label="Horizontal Venting ">
<option value="2 " data-price="450 ">Wall Kit</option>
<option value="2 " data-price="475 ">Corner Kit</option>
<option data-price="499 " value="1 ">Up & Out Kit-Basement</option>
</optgroup>
<optgroup label ="Vertical Venting ">
<option value="3 " data-price="305 ">Plus 15 per/ft and 45 per/elbow</option>
<select id="15perft ">
<option value="15 ">15 *1</option>
<option value="30 ">15 *2</option>
</optgroup>
</select>
</fieldset>
</div>
<div data-role="fieldcontain ">
<fieldset data-role="controlgroup ">
<legend>Installation</legend>
<label for="install ">Installation</label>
<select id ="install " class="vars " name="install ">
<option value="2 " data-price="0 " >Select Installation</option>
<option value="2 " data-price="499 ">Standard Installation</option>
<option value="2 " data-price="900 ">Complete Installation (Full Tear Out)</option>
<option value="2 " data-price="215 ">Gas Line Installation Plus 5 dollars per/ft</option>
<option value="2 " data-price="250 ">Electric(no charge if electric available)</option>
</select>
</fieldset>
</div>
<div data-role="fieldcontain ">
<fieldset>
<label for="day ">Select Accessories</label>
<select id="accessories " name="accessories " class="vars " multiple="multiple " data-native-menu="false ">
<option>Select Accessories</option>
<option value="2 " data-price="70 " >LP Conversion Kit</option>
<optgroup label="Remote ">
<option value="2 " data-price="120 ">On-Off</option>
<option value="2 " data-price="185 ">Multifunction </option>
<option value="2 " data-price="350 ">Burngreen Kit</option>
</optgroup>
<optgroup label="Versi-Heat System ">
<option value="2 " data-price="450 ">Heat System</option>
<option value="2 " data-price="200 ">Installation</option>
</optgroup>
</select>
</fieldset>
</div>
<a href="#pageone ">Go to Page One</a>
<a href="#finalpage ">Final Total</a>
</div>
</div>
<!--
DXV-35 DeepTimber Fire III Direct Vent Fireplace Pricing....................END................
-->
<!-- This is the final page output for final total of all items
lines 154 thru 166
-->
<div data-role="page " id="finalpage ">
<div data-role="main " class="ui-content ">
<div data-role="fieldcontain ">
<fieldset data-role="controlgroup ">
<legend>Final Price</legend>
<label for="item-price ">Final Price</label>
<div id="item-price "></div>
</fieldset>
</div>
<a href="#pagetwo ">Back</a>
<a href="#pageone ">Go to Page One</a>
</div>
</div>
<!--
End final page code
-->
脚本：
var basePrice = 0;
$(".vars").change(function () {
newPrice = basePrice;
$('.vars option:selected').each(function () {
newPrice += $(this).data('price')
});
$('#item-price').html(newPrice);
});
答案 0 :(得分：4)
＆＃34; +＆＃34; plus可以被认为是连接运算符，在使用任何算术运算之前，最好是parseFloat或parseInt值。
var basePrice = 0;
$(".vars").change(function () {
newPrice = basePrice;
$('.vars option:selected').each(function () {
newPrice += parseFloat($(this).data('price'));
});
$('#item-price').html(newPrice);
});