On Mon, Mar 24, 2008 at 5:49 PM, dave <[EMAIL PROTECTED]> wrote:
> The mousedown event is created as well. Now Click in the blue box...
> the event is received, but the class doesn't know the value of it's
> member anymore...
It's basically a context issue.
>From your code:
this.div.observe('mousedown', this.mouseDown);
Which is great: it sets up the mouseDown function of your class to
respond to the onmousedown event. However, when that div calls the
observe() method, Prototype automatically sets up the event handler so
that it is /div/ that gets treated as "this" when the event is
triggered.
It's sort of like div has its own copy of your class's mouseDown
method, so when mouseDown() actually starts running, and it gets to
the line
$('output').innerHTML += (this.div + "<br>");
the "this.div" is being parsed as "div.div"--and div doesn't /have/ a
div property. Hence the undefined.
Fortunately, it's easy to put that function back into the proper
context, by "binding" the scope of the event handling function.
Revisiting that first line from your code:
this.div.observe('mousedown', this.mouseDown.bindAsEventListener(this));
Note that call to bindAsEventListener(). The argument is the object
whose context you want that method to be in when it's actually called.
So now when mouseDown gets called, your class instance is running the
show and since it /does/ have a div property, you shouldn't get that
pesky "undefined."
I'm not sure my explanation was particularly good, but you can find
out lots more about this from the API docs:
http://prototypejs.org/api/function (take a look at "bind" /and/
"bindAsEventListener").
Hope that helps.
:Dan
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups "Ruby
on Rails: Spinoffs" group.
To post to this group, send email to rubyonrails-spinoffs@googlegroups.com
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---
