jquery - ドロップダウンのライブ計算

Question

デモ: http://jsfiddle.net/NaUAL/61/

<select name="one" id="one" >
            <option value="0" >Select *</option>
            <option value="3000" >Plan A</option>
            <option value="6000" >Plan B</option>
            <option value="9000" >Plan C</option>

        </select>

<br />

<select name="two" id="two">
        <option>Please choose from above</option>
</select>

<div id="total"></div>

「合計」divに両方の選択ボックスの合計が必要です...

Answer 1

$("#one,#two").change(function() {
    $('#total').text(parseInt($("#one").val()) + parseInt($("#two").val()))
});

ここで私のフィドルをチェックしてください

Answer 2

試す

$("#one,#two").change(function(){
    var val1 = parseInt($('#one').val()) || 0, val2 = parseInt($('#two').val()) || 0;
    $('#total').text(val1 + val2)
})

デモ:フィドル

Answer 3

デモ

$('#two').change(function(){
    if(this.value != ''){
        $('#total').text(parseInt(this.value) + parseInt($("#one option:selected").val()));
    }
});

と

変化する

second.html(html.join());

に

second.html(html.join()).change();

の

$("#one").change(function () {
    var first = $(this),
        second = $("#two"),
        key = first.val(),
        // instead of the original switch code
        vals = data[key] == undefined ? data.base : data[key],
        html = [];
    // create insert html before adding
    $.each(vals, function (i, val) {
        var v = val.split('_');
        html.push('<option value="' + v[1] + '">' + v[0] + '</option>')
    });
    // no need to empty the element before adding the new content
    second.html(html.join()).change(); //added .change()  here
});