Need help understanding binding

Steve Bondy

Hi all, I'm an old C++ programer who has dabbled in web coding and javascript over the years. Lately I've been trying to get a handle on the mooTools framework for javascript. I'm having a bit of trouble understanding how javascript handles binding, or it may be a mootools binding thing, I'm not sure. Any insight is appreciated. The following code works:

var myMenu = new Class({

initialize: function(elements, options){
<!-- <snip>  -->
// Add mouseenter and mouseleave events to each of the menu elements
    this.elements.each(
    function(el,i){
            var obj = this;
            el.addEvent('mouseenter', function(evnt){
               obj.menuOpen(i);
            });
            el.addEvent('mouseleave', function(evnt){
               obj.menuOpen(null);
            });
        }.bind(this) // end of function(el,i)
);  // end of this.elements.each

}, // End of initialize function

menuOpen(evnt, i) {
.... do menu stuff ....
}

});

The anonymous function coded in-line with the call to addEvent works properly and my menu items open and close as expected. What I tried, because it looks better to my C++ trained eyes, and to see if I understood things correctly was this:

var myMenu = new Class({

initialize: function(elements, options){
<!-- <snip>  -->

mouseEnter: function(evnt, i){
               this.menuOpen(evnt, i);
            },
mouseLeave: function(evnt){
               this.menuOpen(null);
            },

// Add mouseenter and mouseleave events to each of the menu elements
this.elements.each(
        function(evnt,i){
            var obj = this;
            el.addEvent('mouseenter', obj.mouseEnter(evnt, i));
            el.addEvent('mouseleave', obj.mouseLeave(evnt, i));
        }.bind(this) // end of function(el,i)
);  // end of this.elements.each

}, // End of initialize function

menuOpen(evnt, i) {
.... do menu stuff ....
}

});

This does not work (nothing happens), yet to me it looks like it should. I'm pretty sure it has to do with binding the functions to the proper object in the addEvent calls (or something) but none of the things I've tried have worked. If you can give some clues to help me understand what's going wrong here I'd