选择下拉列表，出现不同数据，并计算

Posted 2020-10-05 TigerZhang

点击下拉框，出现缴纳电费，水费，燃气费三个选项。选择其一，下边对应的单价改变，选择数量，进行计算。

//结构
<select name="type" class="form-control feeName"
									onchange="show_sub(this.options[this.options.selectedIndex].value)">
									
									<c:forEach items="${datas}" var="da">
									<option value="${da.type}" price="${da.val}">${da.name}</option>
									</c:forEach>
	
								</select>

　　

//计算 

var firstPrice = parseFloat($(".feeName").children("option:first-child").attr("price"));
$("#price").val(firstPrice.toFixed(2));
var num = parseInt($("#num").val());
var money = firstPrice*num;
$("#totalPrice").text(money.toFixed(2));
add();

//选择3个选项获取不同的单价
function show_sub(v) {
parseInt($("#num").val(1));
if (v == 1) {
var firstPrice = parseFloat($(".feeName").children("option:first-child").attr("price"));
var money = firstPrice*num;
$("#price").val(firstPrice.toFixed(2));
$("#totalPrice").text(money.toFixed(2));
}
if (v == 2) {
var secondPrice = parseFloat($(".feeName").children("option:nth-child(2)").attr("price"));
var money = secondPrice*num;
$("#price").val(secondPrice.toFixed(2));
$("#totalPrice").text(money.toFixed(2));

}
if (v == 3) {
var lastPrice = parseFloat($(".feeName").children("option:last-child").attr("price"));
var money = lastPrice*num;
$("#price").val(lastPrice.toFixed(2));
$("#totalPrice").text(money.toFixed(2));
}
}

//购物车加减
function add() {

$(".addNum").click(function() {
var numTextVal = $(this).parent().find("#num");
numTextVal.val(parseInt(numTextVal.val()) + 1);
setTotal();
});

$(".minNum").click(function() {
var numTextVal = $(this).parent().find("#num");
numTextVal.val(parseInt(numTextVal.val()) - 1);
if (parseInt(numTextVal.val()) < 1) {
numTextVal.val(1);
};
setTotal();
});

function setTotal() {
var s = 0;
$("#formData").each(function() {
s += parseInt($(this).find(‘input[id*=num]‘).val()) * parseFloat($(this).find(‘input[id*=price]‘).val());
});

$("#totalPrice").text(s.toFixed(2));
};
setTotal();

};

//输完数量自动计算
$(function(){
$("#num").change(function(){
$("#totalPrice").text($(this).val()*$("#price").val());

$(".mT1").each(function(){
var money = parseInt($(this).text());
function toThousands(num) {
var result = [ ], counter = 0;
num = (num || 0).toString().split(‘‘);
for (var i = num.length - 1; i >= 0; i--) {
counter++;
result.unshift(num[i]);
if (!(counter % 3) && i != 0) { result.unshift(‘,‘); }
}
return result.join(‘‘);
}
$(this).text(toThousands(money));
});
});
})