jquery - jQuery: コンマで区切られた値を追加します

Question

コンマで区切られた値を追加しようとしています。

試した-

$(function(){
    $('#sum').keyup(function(){
    var prevalue=$('#sum').val().split(",");
        for (i=0;i<prevalue.length;i++){
            prevalue+=prevalue[i];
             $('h1').html(prevalue);
}

    });

});

この配列は無限になり、値をループしません。

コンマで区切られた値を追加するにはどうすればよいですか?

フィドル

Answer 1

prevalueまだ操作している間に上書きしています。代わりに別の変数を使用してください。

$(function(){
    $('#sum').keyup(function(){
    var prevalue=$('#sum').val().split(","), value = 0;
        for (i=0;i<prevalue.length;i++){
            value+=parseInt(prevalue[i], 10);
             $('h1').html(value);
        }  

    });

});

Answer 2

配列を含むはずの同じ配列を変更していた主な問題に加えて、あなたがしていることを処理する方がはるかに優れています。

$(document).ready(function() {
    $('#sum').keyup(function() {
        var sum = 0;
        $('#sum').val().split(',').map(function(n) {
            if(!n) return;
            sum += parseInt(n);
            return sum;
        });
        $('#result').text(sum);
    });
});

こちらのデモをご覧ください。

Answer 3

値と合計に同じ変数を使用しているため、これは機能しません。次のようなことを試してください：

$(function(){
    $('#sum').keyup(function() {
        var values = $('#sum').val().split(",");
        var sum = 0;
        for (i = 0; i < values.length; i++) {
            // At this point values[i] is still a string, so you need to parse it to float or int
            sum += parseFloat(values[i]);
        }

        $('h1').html(sum);
    });
});