Chrome / jQuery Uncaught RangeError: Đã vượt quá kích thước ngăn xếp cuộc gọi tối đa

Tôi gặp lỗi "Uncaught RangeError: Đã vượt quá kích thước ngăn xếp cuộc gọi tối đa" trên chrome. đây là hàm jQuery của tôi

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

Lưu ý rằng có hàng chục nghìn ô trong trang. Tuy nhiên, tôi thường liên kết tràn ngăn xếp với đệ quy và trong trường hợp này theo như tôi thấy thì không có.

Việc tạo một lambda như thế này có tự động tạo ra một lượng nội dung trên ngăn xếp không? có cách nào làm tròn nó không?

Hiện tại, cách giải quyết duy nhất mà tôi có là tạo các sự kiện onclick một cách rõ ràng trên mỗi ô khi hiển thị HTML, điều này làm cho HTML lớn hơn nhiều.

Vì "có hàng chục nghìn ô trong trang" liên kết sự kiện nhấp chuột với mỗi ô sẽ gây ra sự cố hiệu suất khủng khiếp. Có một cách tốt hơn để làm điều này, đó là liên kết một sự kiện nhấp chuột với nội dung và sau đó tìm hiểu xem phần tử ô có phải là mục tiêu của nhấp chuột hay không. Như thế này:

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

Phương pháp này sẽ không chỉ thực hiện nhiệm vụ của bạn với thẻ "td" gốc mà còn với "td" được nối sau đó. Tôi nghĩ bạn sẽ quan tâm đến bài viết này về ràng buộc sự kiện và ủy quyền

Hoặc bạn có thể đơn giản sử dụng phương thức " .on () " của jQuery với tác dụng tương tự:

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

Bạn cũng có thể gặp lỗi này khi bạn có vòng lặp vô hạn. Đảm bảo rằng bạn không có bất kỳ tham chiếu tự đệ quy, bất tận.

Sự nhầm lẫn của tôi xảy ra nhiều hơn, những gì đã xảy ra là nhấp chuột lặp lại (tôi đoán) về cơ bản bằng cách nhấp vào đăng nhập, cha mẹ cũng đã được nhấp vào, điều này dẫn đến việc vượt quá kích thước ngăn xếp cuộc gọi tối đa.

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

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

Sự cố này đã xảy ra với tôi khi tôi sử dụng jQUery Fancybox bên trong một trang web có nhiều plugin jQuery khác. Khi tôi sử dụng LightBox ( trang web ở đây ) thay vì Fancybox, sự cố đã biến mất.

Bạn có thể sử dụng

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

Gần đây tôi cũng vừa gặp phải vấn đề này. Tôi đã có một bảng rất lớn trong div hộp thoại. Đó là> 15.000 hàng. Khi .empty () được gọi trên div hộp thoại, tôi đã gặp lỗi ở trên.

Tôi đã tìm thấy một giải pháp xoay vòng trong đó trước khi gọi làm sạch hộp thoại, tôi sẽ xóa mọi hàng khác khỏi bảng rất lớn, sau đó gọi .empty (). Nó dường như đã hoạt động mặc dù. Có vẻ như phiên bản JQuery cũ của tôi không thể xử lý các phần tử lớn như vậy.