嘗試獲取事件外的更新數組的值

Question

在function changing()下面我試圖獲取數組arr [0]的值並輸出一些與數組值有關的信息。我想問題是arr沒有被更新。我需要更新這個事件之外的數組，以便我可以使用函數中的值。我怎樣才能做到這一點？林學習的pub/sub和.trigger（），所以如果你可以給屬於該風格的結果，將是巨大

arr = [] 
$('body').on("clicked", function() { 
    // $(".clickMe").on("click", function(){ 
    if ($('#thisBox')[0].checked) { 
     $('#thisBox').prop('checked', false); 
     data = false; 
     console.log(data) 
     arr[0] = (data) 
     console.log(arr) 
    } else { 
     $('#thisBox').prop('checked', true); 
     // console.log(prop('checked')) 
     data = true; 
     console.log(data) 
     arr[0] = data 
     console.log(arr) 
    } 
    // }); 
}); 
console.log("outside" + arr) 

function changing() { 
    $('body').trigger("clicked"); 
    if (arr[0] == undefined) { 
     $(".output").html("set undefined") 
    } else if (arr[0] == true) { 
     $(".output").html("set true") 
    } else if (arr[0] == false) { 
     $(".output").html("set false") 
    } 
} 
changing() 

$(".secondClick").on("click", function() { 
    $('body').trigger("clicked"); 
    if (arr[0] == true) { 
     $("body").css("backgroundColor", 'blue') 
    } else if (arr[0] == false) { 
     $("body").css("backgroundColor", 'green') 
    } 
}) 

Answer 1

我相信你想要的代碼看起來更象這樣。該代碼是自我評價

JSFiddle

/*Click handles change colors button*/ 
 
$('.secondClick').click(function() { 
 
    /*sets checked to a boolean of the checkbox*/ 
 
    var checked = $('#thisBox').prop('checked'); 
 
    /*executes function*/ 
 
    change(checked); 
 
}); 
 
/*Handles alternate colors button*/ 
 
$('.alternateClick').click(function() { 
 
    /*Sets the checkbox opposite of what the checkbox was*/ 
 
    $('#thisBox').prop('checked',!$('#thisBox').prop('checked')); 
 
    /*sets checked to a boolean of the checkbox*/ 
 
    var checked = $('#thisBox').prop('checked'); 
 
    /*executes function*/ 
 
    change(checked); 
 
}); 
 

 
/*takes a boolean to change body color*/ 
 
function change(myBoolean) { 
 
    if (myBoolean) { 
 
     $("body").css("backgroundColor", 'blue'); 
 
    } else { 
 
     $("body").css("backgroundColor", 'green') 
 
    } 
 
} 
 
/*initiates the first change events so the page 
 
is green on first page run.*/ 
 
change($('#thisBox').prop('checked'));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input id="thisBox" type="checkbox"></input> 
 
<button class="secondClick">Change Colors</button> 
 
<button class="alternateClick">Alternate Colors</button>