なぜこの機能はブール変数で機能しませんか？

Question

ボタンをクリック（全部で5回）した後にいくつかのレイヤーを表示/非表示し、クリックされたボタンの色を変更する簡単なコードを書きました。それはうまく動作します。しかし、私は特定の要素を表示したかった - 矢印 - ブール変数を使って最初のボタンをクリックした後で、それが機能していないと、if文は最初の部分を返すことはありません。私は何が欠けていますか？

var click01 = false; 

function allowright1() { 
    if (click01 == true) { 
    console.log('hoooray'); 
    $('#right_arrow').removeClass('hidden').addClass('visible'); 
    } else { 
    console.log('not working'); 
    } 
}; 

$('#tile1_p1').click(function() { 
    if ($('#1layers1').css('display') == 'none') { 
    $('#1layers2, #1layers3, #1layers4, #1layers5').removeClass('block').addClass('none'); 
     $('#tile2_p1, #tile3_p1, #tile4_p1, #tile5_p1').removeClass('orange'); 
     $('#1layers1').removeClass('none').addClass('block'); $('#tile1_p1').removeClass('white').addClass('orange'); 
     var click01 = true; 
     console.log('click01 ' + click01); 
     allowright1(); 
    } 
    else if ($('#1layers1').css('display') == 'block') { 
     $('#1layers1').removeClass('block').addClass('none'); 
     $('#tile1_p1').removeClass('orange').addClass('white'); 
    } 
    }); 

Answer 1

トップレベルの変数click01を再割り当てしていません。

var click01 = true;を指定すると、トップレベル変数とは異なるクリックハンドラ内の変数が宣言されます。 varを削除すると、それはあなたのために機能するはずです（例：

$(...).click(function() { 
    ... 
    click01 = true; // by removing var we reassign the top level variable 
    ... 
});