최대 통화 스택 초과

Question

GPS 좌표를 한 번 가져오고 그 페이지와 내가 페이지에 표시하는 레스토랑 목록 간의 거리를 계산하는 자바 스크립트를 작성하고 있습니다.

$(document).bind("DOMNodeInserted", function(e) { 

    if($('#user-gps').length) { 

     $('.restaurant').each(function(index, value) { 
      var lat = $(value).find('.latitude').attr('data-src'); 
      var long = $(value).find('.longitude').attr('data-src'); 

      var distance = geolocator.calcDistance({ 
       from: { 
        latitude: $('#user-gps').attr('lat'), 
        longitude: $('#user-gps').attr('long') 
       }, 
       to: { 
        latitude: lat, 
        longitude: long 
       }, 
        formula: geolocator.DistanceFormula.HAVERSINE, 
        unitSystem: geolocator.UnitSystem.METRIC 
      }); 

      var string = Math.round(distance * 10)/10 + "km"; 
      var restaurantTitle = '#restaurant-' + index + ' .restaurant-title'; 
      //$(restaurantTitle).append(string); 
      // 
      console.log($(restaurantTitle)); 

      //console.log($(value).find('.restaurant-title').text() + " - " + Math.round(distance, -1) + "km"); 
      $(restaurantTitle).append('<span>' + string + '</span>'); 
     }); 
    } 

}); 

나는 각 레스토랑을 반복하고 거리를 계산하며, 그 후에 3.2km와 같은 값을 표시하도록 문자열을 포맷합니다. 그런 다음 이것을 DOM에 추가하려고합니다.

$(restaurantTitle).append('<span>' + string + '</span>'); 

은 곧 내가 이것을 시도로 나는 최대 호출 스택 콘솔에서 오류를 초과 얻을.

나는 내가 현재 반복하고있는 요소만을 선택하고 있는지 확인하기 위해 몇 가지 방법을 시도했다. 나는 각 식당에 독특한 ID를 부여하기까지했다. 선택기를 완벽하게 잘 작동하지만 추가 또는 어떤 식 으로든 오류를 가져 오지 않고 문자열을 추가 할 수 없습니다.

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

Answer 1

당신은 document 수준에 DOMNodeInserted 이벤트에이를 구속하고, 한 당신은 당신이 것을하는 DOM 노드를 삽입 차례로 DOMNodeInserted 이벤트를 트리거하는 범위를 삽입하는 이벤트를 트리거하고있는 범위를 삽입 할 때 스택을 가득 채울 때까지 트리거하는 스팬을 삽입합니다.

당신은 당신의 논리를 다시 생각하고, 당신이

이