多选金额

Question

我有不同的选择，其中有不同的值。如何获得这些值的总量？

例如，我有

<select class="total">
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>5</option>
</select>
<select class="total">
    <option>2</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>5</option>
</select>

如果我从第一个select 1中选择，并从第二个2中选择，我希望获得3作为结果。

http://jsfiddle.net/vQ8Bm/

Answer 1

您应该查看选定的元素，并将每个元素转换为整数，然后添加它们。

var sum = 0;
$('.total :selected').each(function () {
    sum += parseInt($(this).text());
});

• Demo

更新

在select change事件内部

$('.total').change(function () {
    var sum = 0;
    $('.total :selected').each(function () {
        sum += parseInt($(this).text());
    });
});

Answer 2

$(document).ready(function () {
    $('.total').on('change', function () {
        var sum = 0;
        $('.total').each(function () {
            sum += parseInt(this.value, 10);
        });
        alert(sum);
    });
});

Answer 3

以防万一，一个vanilla-js解决方案

var map = Array.prototype.map;

var res = map.call(document.getElementsByClassName('total'), function( select ) {
    return select.value;
}).reduce(function( a, b ) {
    return +a + +b;
});

alert(res);

演示：http://jsfiddle.net/vQ8Bm/6/