我有一个脚本,显示下拉菜单中每个选项的总价格。现在我需要显示所选菜单的名称和总数。
您将在下面找到显示总价的脚本。我需要它来显示name
中的<option>
。
知道如何修改它以显示所选每个下拉列表的名称吗?
//<![CDATA[
$(function() {
$("#type").on("change", function() {
$("select.calculate option").eq(0).prop('selected', true);
calc();
});
$("select.calculate").on("change", calc);
$("input[type=checkbox].calculate").on("click", calc);
function calc() {
var basePrice = 0;
newPrice = basePrice;
$("select.calculate option:selected,input[type=checkbox].calculate:checked").each(function(idx, el) {
newPrice += parseInt($(el).data('price'), 10);
});
newPrice = newPrice.toFixed(2);
$("#item-price").html(newPrice);
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="type" name="buyer" class="form-control input-lg form-el">
<option value="">Service Needed</option>
<option value="kite">Car Wash & Detailing</option>
<option value="user">Mechanic visit</option>
<option value="elect">Electrican visit</option>
<option value="tyre">Tyre Service</option>
<option value="bat">Battery Service</option>
</select>
<div style='display:none; ' id='business'>
<select id="type2" name="buyername" class="form-control input-lg form-el calculate">
<option data-price="0" value="">-- Select --</option>
<option data-price="100" value="kite1">Car Wash exterior</option>
<option data-price="150" value="kite1">Car Wash In & Out</option>
<option data-price="1000" value="kite2">Full Detailing</option>
</select>
</div>
<div style='display:none; ' id='tyrem'>
<select id="type2" name="tyrem" class="form-control input-lg form-el calculate">
<option data-price="0" value="">-- Select --</option>
<option data-price="100" value="kite1">Road tyre problem rescue</option>
<option data-price="50" value="kite1">4 Tyre pressure check and adjust</option>
<option data-price="100" value="kite2">tyre 1 plug repair</option>
</select>
</div>
<div style='display:none; ' id='batm'>
<select id="type2" name="batm" class="form-control input-lg form-el calculate">
<option data-price="0" value="">-- Select --</option>
<option data-price="100" value="kite1">Battery rescue / jump start</option>
<option data-price="150" value="kite2">Battery check , jump start or replace - price depends on battery</option>
</select>
<span id="item-price">0</span>
</div>