计算从复选框+选择列表

Question

总价我想从选择列表+复选框计算总价

这个代码表示从列表中选择元素的价格“电视”：

<script type="text/javascript"> 
$(document).ready(function() { 
var cheap = false; 
$('#tvs').change(function() { 
    var price = parseFloat($('.total').data('base-price')) || 0; 
    $('#tvs').each(function (i, el) { 
     price += parseFloat($('option:selected', el).data(cheap ? 'cheap' : 'price')); 
     console.log('x', price) 
     $('.total').val(price.toFixed(2) + '' + '$'); 
     }); 
     }); 
     }); 
</script> 



<input placeholder="0.00$" style=" width: 65px; border: 0px;" class="total" data-base-price="0" readOnly> 

并显示选中的复选框的价格验证码：

 <script type="text/javascript"> 
     function update_amounts_modal() { 
var sum = 0.0; 
$('form').each(function() { 
    var qty = $(this).find('.qty').val(); 
    var price = $(this).find('.price').val(); 
    var isChecked = $(this).find('.idRow').prop("checked"); 
    if (isChecked){ 
     qty = parseInt(qty, 10) || 0; 
     price = parseFloat(price) || 0; 
     var amount = (qty * price); 
     sum += amount; 
    } 
}); 
$('.total-modal').text(sum.toFixed(2) + ' ' + '$'); 


    $().ready(function() { 
update_amounts_modal(); 
$('form .qty, form .idRow').change(function() { 
    update_amounts_modal(); 
    }); 
    }); 
</script> 


<div id="subusers" class="total-modal">0.00 $</div> 

Answer 1

嘿@我musa94假设你有一个相当大的应用程序，并将代码分离为文件，以及如何总结不同块代码中的两个值。在不改变太多现有代码的情况下，简单的方法是定义一个共享数据对象，该对象包含要处理整个应用程序的值。您可以通过访问数据对象中的值来将列表和复选框中的值加起来。

// define a data object that exists in your application 
window.__ = window.__ || { data: { total: 0, modal: 0 } }; 

$(document).ready(function() { 
    var cheap = false; 

    $('#tvs').change(function() { 
    var total = getTvsTotal(cheap); 
    // update your view 
    $('.total').val(total.toFixed(2) + '' + '$'); 
    // update your data object 
    __.data.total = total; 
    console.log('review data object', __); 
    }); 
}); 

$(document).ready(function() { 
    $('form .qty, form .idRow').change(function() { 
    var total = update_amounts_modal(); 
    $('.total-modal').text(total.toFixed(2) + ' ' + '$'); 

    __.data.modal = total; 
    console.log('review data object', __); 
    }); 
}); 

/** 
* calculate your tvs total 
* @param {boolean} 
* @return {number} 
*/ 
function getTvsTotal(cheap) { 
    var price = parseFloat($('.total').data('base-price')) || 0; 

    $('#tvs').each(function (i, el) { 
     price += parseFloat($('option:selected', el).data(cheap ? 'cheap' : 'price')); 
     console.log('list total:', price);  
    }); 

    return price; 
} 

/** 
* calculate your amounts modal 
* @return {number} 
*/ 
function update_amounts_modal() { 
    var sum = 0.0; 

    $('form').each(function() { 
    var qty = $(this).find('.qty').val(); 
    var price = $(this).find('.price').val(); 
    var isChecked = $(this).find('.idRow').prop("checked"); 
    var amount; 

    if (isChecked){ 
     qty = parseInt(qty, 10) || 0; 
     price = parseFloat(price) || 0; 
     amount = qty * price; 
     sum += amount; 
    } 
    console.log('sum:', sum); 
    }); 

    return sum; 
}