Печать массива массива на выделенный объект

Question

У меня есть объект, который имеет несколько элементов, которые имеют массив массивов значений. У меня также есть страница с серией элементов div, которая позволяет пользователю щелкнуть по ним и показать массив массива, связанный с делением, которое они нажали. Однако этого не происходит, когда я нажимаю на div, в котором находится объект, я получаю ничего, кроме неопределенных журналов. Может ли кто-нибудь объяснить мне, что я делаю неправильно?

var Alerts = { 
    apu: [["APU Power Fail", "APU[1]"], ["APU Power Fault", "APU[2]"], ["APU Generator Fail", "APU[3]"], ["APU High Oil Temperature", "APU[4]"], ["APU Hot Start", "APU[5]"], ["APU Loss Overspeed Protection", "APU[6]"], ["APU Starter Engaged", "APU[7]"], ["APU Fire", "APU[8]"], ["APU Fails Bite Check", "APU[9]"], ["APU Door Fails to Open", "APU[10]"], ["APU No Flame", "APU[11]"], ["Left Fire Bottle Discharge", "APU[12]"]], 

    avionics: [["ADS 1 Fail", "AVIONICS[1]"], ["ADS 2 Fail", "AVIONICS[2]"], ["ADS 3 Fail", "AVIONICS[3]"], ["AP 1 Fail", "AVIONICS[4]"], ["AP 2 Fail", "AVIONICS[5]"], ["Autopilots Fail", "AVIONICS[6]"], ["Baroset 1 Fail", "AVIONICS[7]"], ["Baroset 2 Fail", "AVIONICS[8]"], ["Baroset 3 Fail", "AVIONICS[9]"], ["CCD 1 Fail", "AVIONICS[10]"], ["CCD 2 Fail", "AVIONICS[11]"], ["Heading Comparison Monitor", "AVIONICS[12]"], ["Heading and Roll Comparison Monitor", "AVIONICS[13]"], ["Display Controller 1 Fail", "AVIONICS[14]"], ["Display Controller 2 Fail", "AVIONICS[15]"], ["IRS 1 Fail", "AVIONICS[16]"], ["IRS 2 Fail", "AVIONICS[17]"], ["IRS 3 Fail", "AVIONICS[18]"], ["Glideslope Antenna Fail", "AVIONICS[19]"], ["MAU 1A Fail", "AVIONICS[20]"], ["MAU 1B Fail", "AVIONICS[21]"], ["MAU 2A Fail", "AVIONICS[22]"], ["MAU 2B Fail", "AVIONICS[23]"], ["MAU 3A Fail", "AVIONICS[24]"], ["MAU 3B Fail", "AVIONICS[25]"], ["MRC 1 Fail", "AVIONICS[26]"], ["MRC 2 Fail", "AVIONICS[27]"], ["GPS Degrade", "AVIONICS[28]"], ["GPS #1 Fail", "AVIONICS[28]"], ["GPS #2 Fail", "AVIONICS[30]"], ["Display Unit 1 Fail", "AVIONICS[31]"], ["Display Unit 2 Fail", "AVIONICS[32]"], ["Display Unit 3 Fail", "AVIONICS[33]"], ["Display Unit 4 Fail", "AVIONICS[34]"], ["GPS - Unable RNP", "AVIONICS[35]"]] 
} 
for(var array in Alerts){ 
    var system = array.toUpperCase(); 
    $("#form_emergencies").append("<div class='systems' id='" +array +"'><div class='select_box'></div><h2> " +system +"</h2></div>"); 

    $(".systems").on("click", function(){ 
     $.each(Alerts[array], function(ind,item){ 
      console.log(Alerts[array].item); 
     }) 
    }) 
} 

Answer 1

Ваш выбор имен переменных довольно запутан.

Давайте начнем с for(var array in Alerts), в этом заявлении array не на самом деле массив, это просто относится к ключу, который в свою очередь представляет собой систему в домене, поэтому я хотел бы изменить array к systemKey.

Затем вы продолжаете и присоединяете обработчики внутри петли. Этот код является проблематичным, потому что вторая система в конечном итоге будет иметь два обработчика кликов.

for(var systemKey in Alerts){ 
    var system = systemKey.toUpperCase(); 
    $("#form_emergencies").append("<div class='systems' id='" +systemKey +"'><div class='select_box'></div><h2> " +system +"</h2></div>"); 
} 

//Notice I used this.id rather than array 
$(".systems").on("click", function(){ 
    $.each(Alerts[this.id], function(ind,item){ 
     //... 
    }) 
}) 

Наконец, console.log(Alerts[array].item); неправильно, просто положить console.log(item);

Answer 2

Попробуйте это. demo

for(var array in Alerts){ 
    var system = array.toUpperCase(); 
    $("#form_emergencies").append("<div class='systems' id='" +array +"'><div class='select_box'></div><h2> " +system +"</h2></div>");  
} 


$(".systems").on("click", function(){ 
    var keyVal = $(this).attr("id"); 
    $.each(Alerts[keyVal], function(ind,item){ 
     $.each(item, function(ind2,item2){ 
       console.log(Alerts[keyVal][ind][ind2]); 
     }); 
    }) 
});