我有一个正确填充元素列表的对象,当我点击其中一个元素时,我试图从该对象获取特定数据。现在它无论我在哪里点击都只返回最后一个对象项。我能得到正确的数据吗?
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]"]]
}
var description, breaker;
for(var key in Alerts){
var system = key.toUpperCase();
$("#systems").append("<div class='systems' id='" +key +"'><div class='select_box'></div><h2>" +system +"</h2></div>");
}
$("#systems").on("click", ".systems", function(){
$("#malfunctions").children().remove();
$(this).find(".select_box").each(function(){
$(".selected").removeClass("selected");
$(this).addClass("selected");
})
$.each(Alerts[this.id], function(ind,item){
breaker = item[1];
$("#malfunctions").append("<div class='systems'><div class='select_box'></div><p>" +item[0] +"</p></div>");
})
})
$("#malfunctions").on("click", ".systems", function(){
var id = $(this).text();
console.log(id);
console.log(breaker);
$(this).find(".select_box").each(function(){
if($(this).hasClass("selected")){
$(this).removeClass("selected");
}
else{
$(this).addClass("selected");
}
})
})
答案 0 :(得分:0)
试试这个解决方案:javascript允许创建IIFE功能:) ...
for(var key in Alerts){
var system = key.toUpperCase();
(function(key,system ){
$("#systems").append("<div class='systems' id='" +key +"'><div class='select_box'></div><h2>" +system +"</h2></div>");
$("#"+key).on("click",function(){
alert(key);
});
})(key,system );
}
这个例子。你应该在代码中使用它吗:)