jQuery: Too Much Recursion and Maximum Call Stack Size Exceeded

I'm building an app that has a jQuery function that flips individual cards. However, in Firefox and Chrome I keep getting the errors "Too Much Recursion" and "Maximum call stack size exceeded" respectively.

From other articles around the matter, I added stopImmediatePropagation() to the calls, but am still getting the errors... not as many as before, but still cripples things enough to notice.

There is a base "card" that should flip, followed by buttons and test sitting on top, that should not cause the card to flip. The below works but causes the recursion from jQuery's bubbling.

Current code is:

  $(document).on("click", ".card-container", function(e){
    e.stopImmediatePropagation();  
    $(this).flip();
  });
  $(document).on("click", ".btn", function(e){
    e.stopImmediatePropagation(); 
    $(this).click();
  });
  $(document).on("click", "p", function(e){
    $(this).click();
  });

What should I do to prevent these errors from occurring?

Cheers :)


The following code blocks are responsible for that error,

$(document).on("click", ".btn", function(e){
    e.stopImmediatePropagation(); 
    $(this).click();
});

$(document).on("click", "p", function(e){
    $(this).click();
});

Remove it. It does not make any sense.

DEMO

Note: see the error on the console

链接地址: http://www.djcxy.com/p/71694.html

上一篇: 清除JavaScript调用堆栈

下一篇: jQuery:太多的递归和最大的调用堆栈大小超过