Chrome / jQuery Uncaught RangeError : 최대 호출 스택 크기 초과

크롬에서 "Uncaught RangeError : Maximum call stack size exceeded"오류가 발생합니다. 여기 내 jQuery 함수입니다.

$('td').click(function () {
        if ($(this).context.id != null && $(this).context.id != '') {
            foo($('#docId').val(), $(this).attr('id'));
        }
        return false;
    });

페이지에는 수만 개의 셀이 있습니다. 그러나 일반적으로 스택 오버플로를 재귀와 연관시키고이 경우에는 아무것도 없다는 것을 알 수 있습니다.

이와 같은 람다를 생성하면 스택에 많은 항목이 자동으로 생성됩니까? 그 주위에 방법이 있습니까?

현재 유일한 해결 방법은 HTML을 렌더링 할 때 각 셀에서 명시 적으로 onclick 이벤트를 생성하는 것이므로 HTML이 훨씬 더 커집니다.

"페이지에 수만 개의 셀이 있습니다"로 클릭 이벤트를 모든 단일 셀에 바인딩하면 끔찍한 성능 문제가 발생합니다. 이를 수행하는 더 좋은 방법은 클릭 이벤트를 본문에 바인딩 한 다음 셀 요소가 클릭 대상인지 확인하는 것입니다. 이렇게 :

$('body').click(function(e){
       var Elem = e.target;
       if (Elem.nodeName=='td'){
           //.... your business goes here....
           // remember to replace $(this) with $(Elem)
       }
})

이 방법은 기본 "td"태그뿐만 아니라 나중에 "td"를 추가하여 작업을 수행합니다. 이벤트 바인딩 및 델리게이트에 대한이 기사에 관심이 있으실 것 같습니다.

또는 단순히 동일한 효과로 jQuery 의 " .on () "메소드를 사용할 수 있습니다 .

$('body').on('click', 'td', function(){
        ...
});

무한 루프가있는 경우에도이 오류가 발생할 수 있습니다. 끝없이 반복되는 자체 참조가 없는지 확인하십시오.

내 실수는 더 많았습니다. 기본적으로 로그인을 클릭하여 루프 클릭 (내 생각에)을 클릭하여 부모도 클릭하여 최대 호출 스택 크기를 초과했습니다.

$('.clickhere').click(function(){
   $('.login').click();
});

<li class="clickhere">
  <a href="#" class="login">login</a>
</li>

이 문제는 다른 많은 jQuery 플러그인과 함께 웹 사이트 내에서 jQUery Fancybox를 사용할 때 발생했습니다. Fancybox 대신 LightBox ( site here )를 사용했을 때 문제가 사라졌습니다.

U 사용할 수 있습니다

  $(document).on('click','p.class',function(e){
   e.preventDefault();
      //Code 
   });

최근에이 문제도 만났습니다. 대화 div에 매우 큰 테이블이 있습니다. 15,000 행 이상이었습니다. .empty ()가 div 대화 상자에서 호출되었을 때 위의 오류가 발생했습니다.

대화 상자 정리를 호출하기 전에 매우 큰 테이블에서 다른 모든 행을 제거한 다음 .empty ()를 호출하는 원형 솔루션을 찾았습니다. 그래도 효과가 있었던 것 같습니다. 내 이전 버전의 JQuery는 이러한 큰 요소를 처리 할 수없는 것 같습니다.