Uncaught RangeError: Maximum call stack size exceeded, JavaScript

Question

I have a problem

    open: function($type) {
          //Some code
          document.getElementById($type).addEventListener("click", l.close($type), false);
    },
    close: function($type) {
           //There is some code too
           document.getElementById($type).removeEventListener("click", l.close($type), false);
           //^ Recursion & Uncaught RangeError: Maximum call stack size exceeded
    }

What I'm doing wrong? Without this click event listener everything is working well. And what is the third parameter doing (true|false)? Thank you.

https://developer.mozilla.org/en/DOM/element.removeEventListener the third parameter flags whether or not you want the event listener to use event capturing (as oppose to bubbling) on adding, and on removal whether or not the event was added as such. — davin, Feb 29 '12 at 11:04

score 10 · Accepted Answer · answered Feb 29 '12 at 11:01

10

You are calling the close function in the addEventListener and removeEventListener when you are trying to pass is as an argument (causing an infinite loop). Instead you should simply pass the reference to the function as follows:

document.getElementById($type).addEventListener("click", l.close, false);

And:

document.getElementById($type).removeEventListener("click", l.close, false);

answered Feb 29 '12 at 11:01

Lycha

9,937
3
38
43

Thank you. :) But what is the third parameter doing? – anony_root Feb 29 '12 at 11:19
1

@Krylovech It defines if the handler should be executed during capturing or bubbling phase: http://www.quirksmode.org/js/events_order.html – Lycha Feb 29 '12 at 11:31

score 0 · Answer 2 · answered May 08 '14 at 07:56

0

Or you might have two Javascript functions with the same name.

answered May 08 '14 at 07:56

Khizer Jalal

51
3

Uncaught RangeError: Maximum call stack size exceeded, JavaScript

2 Answers2

Linked