함수를 실행

Question

다음 코드를 감안할 때 :

 for (var key in values) { 
     if (values[key] === true) { 
      console.log(key + " is true") 

      // I want to run this if key has changed. 
      $(".box3").append("<p>" + key + "</p>"); 

      $.getJSON("js/" + key + "/" + key + ".json", function(data) { 
       console.log(data) 

       $.each(data, function(key, val) { 
         console.log(val) 
       $("#whatToOrder2").append("<div class='box'>" + val.name.toUpperCase() + "<input type='number' min='0' max='18' step='1' value='0' name=" + val.name.replace(/\s/g, '') + " class='css-input2 input-form2' placeholder='Menge'>"); 

        }); 
       }); 
      } 

      else { 
       console.log(key + " is false"); 
      } 
     } 
    } 

나는 다른 상자를 표시하는 루프를 가지고 있습니다. 곰팡이처럼, 양파없이. 각 상자에는이 예에서 카테고리가 있습니다. 피자와 케밥 아래 그림에서와 같이.

내 목표는 마지막 요소가이 범주에서로드 된 경우 줄을 추가하는 것입니다. 그런 다음 범주 막대를 DOM에 추가해야합니다. 그래서 키 (피자, 케밥)가 바뀌었을 때 DOM에 요소를 추가하고 싶습니다.

어떻게 보관할 수 있습니까?

도움을 주시면 감사하겠습니다.

Answer 1

내가 이런 식으로 해결

var values = {pizza: true, box: true, kebab: false}; 
 

 
var key; 
 
for (key in values) { 
 
console.log(key); 
 
}

Answer 2

첫 번째 루프에서 VAR을 제거 :

이

$.each(values, function(key, val) { 

      if (val === true) { 

      $.getJSON("js/" + key + "/" + key + ".json", function(data) { 
        $("#whatToOrder2").append("<div class='box3'>" + key + "</div>"); 
        $.each(data, function(key, val) { 

         $("#whatToOrder2").append("<div class='box'>" + val.name.toUpperCase() + "<input type='number' min='0' max='18' step='1' value='0' name=" + val.name.replace(/\s/g, '') + " class='css-input2 input-form2' placeholder='Menge'>"); 

        }); 

       }) 

     } 

      })