javascript - Javascript 変数が定義されていません

Question

何らかの理由で、定義する変数「合計」をまったく取得できません...

私はそれを74のように定義しましたが、何らかの理由で固執したくありません..何が間違っていますか? 前もって感謝します！

$(document).ready(function() {

    function getParameterByName(name)
    {
        name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
        var regexS = "[\\?&]" + name + "=([^&#]*)";
        var regex = new RegExp(regexS);
        var results = regex.exec(window.location.search);
        if(results == null)
            return "";
        else
            return decodeURIComponent(results[1].replace(/\+/g, " "));
    }

    $(".tab-content").hide(); //Hide all content
    $("ul.tabs li:first").addClass("active").show(); //Activate first tab
    $(".tab-content:first").show(); //Show first tab content


    $('.question-form-submit').click(function(e) {
        e.preventDefault();
        var activeTab = '#'+$(this).attr('name');
        var activeClass = activeTab.substr(5);
        $("ul.tabs li").removeClass("active"); 
        $('ul li:nth-child('+activeClass+')').addClass("active"); //Add "active" class to selected tab
        $(".tab-content").hide(); //Hide all tab content
        $(activeTab).fadeIn(); //Fade in the active ID content


        $('.meter-value').removeClass('meter-width');

        switch (activeClass) {
            case '2' :
                $('.meter-value').attr('style', 'background-color: #9496c9; width: 46.5%;');
                break;

            case '3' :
                $('.meter-value').attr('style', 'background-color: #9496c9; width: 67%;');
                break;

            case '4' :
                $('.meter-value').attr('style', 'background-color: #9496c9; width: 100%;');
                break;

        }

        return false;
    });

    $('.quantity, .init_cost').change(function() {

        var row_id = $(this).attr('id');
        var row_number = row_id.substr(9);
        var item_cost = $('#cost_'+row_number).attr('value');
        var item_quantity = $('#quantity_'+row_number).attr('value');
        var final_cost = item_cost * item_quantity;

        $('#final_cost_'+row_number).val(final_cost).formatCurrency();;

    });

    $('.row input').each(function(index) {

        var row_id = $(this).attr('id');
        var row_number = row_id.substr(9);
        var item_cost = $('#cost_'+row_number).attr('value');
        var item_quantity = $('#quantity_'+row_number).attr('value');
        var final_cost = item_cost * item_quantity;

        $('#final_cost_'+row_number).val(final_cost).formatCurrency();;

    });

        var total = 0;
        $('.final_cost').each(function(index) {

            var final_cost = $(this).attr('value').substr(1);
            var total = total + final_cost;
            console.log(total);

        })

});

Answer 1

行の内側の宣言var total = total + final_cost;は、外側の宣言を行から隠しvar total = 0;ます。

Answer 2

each 関数のtotalは、外側の関数をシャドーイングしています。

同じことのより簡単な例を次に示します。

(function()
 {
     var total = 1;
     console.log("total 1: " + total);
     (function()
      {
          console.log("total 2: " + total);
          var total = total + 3;
          console.log("total 3: " + total);
      })()
 })();

シャドウイングに加えて、ホイストを考慮する必要があります。内側の var が一番上に持ち上げられるため、内側の関数は次とほぼ同等です。

function()
{
    var total = undefined;
    console.log("total 2: " + total);
    total = total + 3;
    console.log("total 3: " + total);
}

varこの場合、単純に innerキーワードは必要ないと思います。それ以外の場合は、別の変数名を使用します。

Answer 3

ループするたびに合計を再定義しています

$('.final_cost').each(function(index) {

    var final_cost = $(this).attr('value').substr(1);
    var total = total + final_cost;
    console.log(total);

})

これを試してみませんか？

$('.final_cost').each(function(index) {

    var final_cost = $(this).attr('value').substr(1);
    total = total + final_cost;
    console.log(total);

})

Answer 4

合計の前に 2 番目の変数を削除してみてください。

total = total + final_cost;

Answer 5

この回答についてはよくわかりませんが、最初に変数 total を 0 などのデフォルト値で定義してから、total + final_cost 操作を使用してみてください。

var total = 0;
total += final_cost;

何故ですか？デフォルト値なしで合計を宣言すると、値は「未定義」になるため、JavaScript は次のように表します。

var total = "undefined" + final_cost;

それがエラーだと思います。

Answer 6

これは、変数を 2 回宣言するためです (書き込むたびに、var total新たに宣言されます。したがって、「final_cost」関数の外側に 1 つ、内側に 1 つあり、外側からの合計 + final_cost に設定されます。したがって、実際には、常に次の値をログに記録します。 final_cost.

書くだけtotal = total + final_cost;でうまくいくはずです。

Answer 7

構文エラー、スクリプトを強制終了:

    $('#final_cost_'+row_number).val(final_cost).formatCurrency();;
                                                                  ^--- extra ;

次回は、ブラウザのコンソール (FF/Chrome では shift-ctrl-J) でエラーを確認してください。このようなことは即座に報告されます。

Answer 8

私は行を置き換えます：

var total = total + final_cost;

と：

total += final_cost