First a solution for you. Try this plugin:
http://plugins.jquery.com/project/bind
Now a note about the "way jQuery is biased" (which you can skip if you prefer).
jQuery is primarily focused on DOM elements. Everything else gets
"attached" to those elements. It's not a "bad" thing, it's just
"different" to what many expect. What I mean by this is if you instead
consider DOM elements to be "views" of internal objects then you'll
find your mindset clashing with the way jQuery is biased.
You've already come across the bias as you can see the bind() function
"binds" a function to a DOM element, and the "this" inside the handler
actually refers to the DOM element rather than some external object.
Karl Rudd
On Wed, Mar 4, 2009 at 10:30 AM, Michael <dmgx.mich...@gmail.com> wrote:
>
> I've recently taken on a job where I have been required to use jQuery
> instead of my usual framework of choice - prototype. I've handled the
> transition well enough but one area of functionality has me befuddled
> - using object methods to handle events. I've been working around the
> problem but the workarounds are quite ugly.
>
> An explanation. First I'll give the code as it would look in prototype
>
> myClass = Class.create({
> this.element: null,
> this.initialize: function( element ) {
> this.element = element;
> element.observe('click',
> this.onClick.bindAsEventListener(this));
> },
>
> this.onClick: function(e) {
> // actions on click here.
> }
> });
>
>
>
> Now I know how to build classes in javascript without prototype's
> Class library. I also know how to use late binding and prototype
> modifications to achieve what that library abstracts. The problem is
> how am I supposed to replicate bindAsEventListener? I've tried...
>
> myClass = function( element ) {
> // element is an element somewhere in the dom that this class will
> manage a behavior for.
> // Assume for the purposes of this example that it's already
> encapsulated in a jQuery object
> this.element = element;
>
> this.onClick = function() {
> // on click actions.
> }
>
> this.element.bind('click', this.onClick );
> }
>
> If I run the code as above the meaning of 'this' is lost.
> Unfortunately
>
> this.element.bind('click', this.onClick ).apply(this); // more or less
> what .bindAsEventListener actually does.
>
> won't work - it causes jQuery to issue an error. So how is anyone
> supposed to use object methods to handle events, a cornerstone of
> object oriented programming?
>
> If I'm to continue using this framework I need to find a solution to
> this problem.
>
