mathis.hoffmann-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org
2008-May-18 11:25 UTC
Event.observe causes "handler has no properties"-error
Hello, I habe a problem with the following code (shortened): var Songlist = { initialize: function() { img = document.createElement(''img''); [...] img.observe(''mouseover'', this.mouseover); $(''body'').insert(img); } mouseover: function() { this.src = ''anotherimage.gif''; } } Songlist.initialize(); Passing the image with my mouse I always get the error: "handler has no properties"! I would be happy if you gave me a tip, where what causes this error! M. Hoffmann --~--~---------~--~----~------------~-------~--~----~ 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-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
mathis.hoffmann-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org
2008-May-18 11:31 UTC
Re: Event.observe causes "handler has no properties"-error
OK, I really tried hard before I posted the above message, but sitting on the toilet I found the mistake. The code must look like that, than it works: var Songlist = { initialize: function() { img = document.createElement(''img''); [...] img.observe(''mouseover'', Songlist.mouseover); $(''body'').insert(img); } mouseover: function() { this.src = ''anotherimage.gif''; } } Songlist.initialize(); On 18 Mai, 13:25, "mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org" <mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org> wrote:> Hello, > > I habe a problem with the following code (shortened): > > var Songlist = { > initialize: function() { > img = document.createElement(''img''); > [...] > img.observe(''mouseover'', this.mouseover); > $(''body'').insert(img); > } > mouseover: function() { > this.src = ''anotherimage.gif''; > } > > } > > Songlist.initialize(); > > Passing the image with my mouse I always get the error: "handler has > no properties"! > I would be happy if you gave me a tip, where what causes this error! > > M. Hoffmann--~--~---------~--~----~------------~-------~--~----~ 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-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
T.J. Crowder
2008-May-18 13:32 UTC
Re: Event.observe causes "handler has no properties"-error
Hi, No, that code probably doesn''t do what you mean it to do -- your code hooking the event:> img.observe(''mouseover'', Songlist.mouseover);...doesn''t preserve "this" (as we discussed in another thread). Consequently when this code gets called:> mouseover: function() { > this.src = ''anotherimage.gif''; > }..."this" will be the window object, not an instance of Songlist. It''s really worth stopping coding for a moment and reading up on how "this" works in JavaScript. I''ve pointed you to this blog entry before: http://blog.niftysnippets.org/2008/04/you-must-remember-this.html Additionally, Flanagan''s book will pay you back in time savings pretty much any time you spend reading it: http://www.oreilly.com/catalog/jscript5/ http://www.amazon.com/dp/0596101996 In terms of the actual problem with the above code, as with last time, you want to use bindAsEventListener: http://www.prototypejs.org/api/function/bindAsEventListener Hope this helps, -- T.J. Crowder tj / crowder software / com On May 18, 12:31 pm, "mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org" <mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org> wrote:> OK, I really tried hard before I posted the above message, but sitting > on the toilet I found the mistake. > The code must look like that, than it works: > > var Songlist = { > initialize: function() { > img = document.createElement(''img''); > [...] > img.observe(''mouseover'', Songlist.mouseover); > $(''body'').insert(img); > } > mouseover: function() { > this.src = ''anotherimage.gif''; > } > > } > > Songlist.initialize(); > > On 18 Mai, 13:25, "mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org" > > <mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org> wrote: > > Hello, > > > I habe a problem with the following code (shortened): > > > var Songlist = { > > initialize: function() { > > img = document.createElement(''img''); > > [...] > > img.observe(''mouseover'', this.mouseover); > > $(''body'').insert(img); > > } > > mouseover: function() { > > this.src = ''anotherimage.gif''; > > } > > > } > > > Songlist.initialize(); > > > Passing the image with my mouse I always get the error: "handler has > > no properties"! > > I would be happy if you gave me a tip, where what causes this error! > > > M. Hoffmann--~--~---------~--~----~------------~-------~--~----~ 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-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
T.J. Crowder
2008-May-18 13:36 UTC
Re: Event.observe causes "handler has no properties"-error
> ..."this" will be the window object, not an instance of Songlist.Doh! Sorry, I forgot, it won''t be window, it''ll be the img element. I keep forgetting that Prototype''s event hooking stuff will default ''this'' in the handler to the element on which the event occurred. My bad, apologies. -- T.J. Crowder tj / crowder software / com On May 18, 2:32 pm, "T.J. Crowder" <tjcrow...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:> Hi, > > No, that code probably doesn''t do what you mean it to do -- your code > hooking the event: > > > img.observe(''mouseover'', Songlist.mouseover); > > ...doesn''t preserve "this" (as we discussed in another thread). > Consequently when this code gets called: > > > mouseover: function() { > > this.src = ''anotherimage.gif''; > > } > > ..."this" will be the window object, not an instance of Songlist. > > It''s really worth stopping coding for a moment and reading up on how > "this" works in JavaScript. I''ve pointed you to this blog entry > before:http://blog.niftysnippets.org/2008/04/you-must-remember-this.html > > Additionally, Flanagan''s book will pay you back in time savings pretty > much any time you spend reading it:http://www.oreilly.com/catalog/jscript5/http://www.amazon.com/dp/0596101996 > > In terms of the actual problem with the above code, as with last time, > you want to use bindAsEventListener:http://www.prototypejs.org/api/function/bindAsEventListener > > Hope this helps, > -- > T.J. Crowder > tj / crowder software / com > On May 18, 12:31 pm, "mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org" > > <mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org> wrote: > > OK, I really tried hard before I posted the above message, but sitting > > on the toilet I found the mistake. > > The code must look like that, than it works: > > > var Songlist = { > > initialize: function() { > > img = document.createElement(''img''); > > [...] > > img.observe(''mouseover'', Songlist.mouseover); > > $(''body'').insert(img); > > } > > mouseover: function() { > > this.src = ''anotherimage.gif''; > > } > > > } > > > Songlist.initialize(); > > > On 18 Mai, 13:25, "mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org" > > > <mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org> wrote: > > > Hello, > > > > I habe a problem with the following code (shortened): > > > > var Songlist = { > > > initialize: function() { > > > img = document.createElement(''img''); > > > [...] > > > img.observe(''mouseover'', this.mouseover); > > > $(''body'').insert(img); > > > } > > > mouseover: function() { > > > this.src = ''anotherimage.gif''; > > > } > > > > } > > > > Songlist.initialize(); > > > > Passing the image with my mouse I always get the error: "handler has > > > no properties"! > > > I would be happy if you gave me a tip, where what causes this error! > > > > M. Hoffmann--~--~---------~--~----~------------~-------~--~----~ 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-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
mathis.hoffmann-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org
2008-May-18 13:46 UTC
Re: Event.observe causes "handler has no properties"-error
No problem. I read the texts you posted last time, so I think I now know, what "this" does :-) This time I, of course, wanted to "this" to be the img to easily change the source. On 18 Mai, 15:36, "T.J. Crowder" <tjcrow...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:> > ..."this" will be the window object, not an instance of Songlist. > > Doh! Sorry, I forgot, it won''t be window, it''ll be the img element. > I keep forgetting that Prototype''s event hooking stuff will default > ''this'' in the handler to the element on which the event occurred. My > bad, apologies. > -- > T.J. Crowder > tj / crowder software / com > > On May 18, 2:32 pm, "T.J. Crowder" <tjcrow...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote: > > > Hi, > > > No, that code probably doesn''t do what you mean it to do -- your code > > hooking the event: > > > > img.observe(''mouseover'', Songlist.mouseover); > > > ...doesn''t preserve "this" (as we discussed in another thread). > > Consequently when this code gets called: > > > > mouseover: function() { > > > this.src = ''anotherimage.gif''; > > > } > > > ..."this" will be the window object, not an instance of Songlist. > > > It''s really worth stopping coding for a moment and reading up on how > > "this" works in JavaScript. I''ve pointed you to this blog entry > > before:http://blog.niftysnippets.org/2008/04/you-must-remember-this.html > > > Additionally, Flanagan''s book will pay you back in time savings pretty > > much any time you spend reading it:http://www.oreilly.com/catalog/jscript5/http://www.amazon.com/dp/0596... > > > In terms of the actual problem with the above code, as with last time, > > you want to use bindAsEventListener:http://www.prototypejs.org/api/function/bindAsEventListener > > > Hope this helps, > > -- > > T.J. Crowder > > tj / crowder software / com > > On May 18, 12:31 pm, "mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org" > > > <mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org> wrote: > > > OK, I really tried hard before I posted the above message, but sitting > > > on the toilet I found the mistake. > > > The code must look like that, than it works: > > > > var Songlist = { > > > initialize: function() { > > > img = document.createElement(''img''); > > > [...] > > > img.observe(''mouseover'', Songlist.mouseover); > > > $(''body'').insert(img); > > > } > > > mouseover: function() { > > > this.src = ''anotherimage.gif''; > > > } > > > > } > > > > Songlist.initialize(); > > > > On 18 Mai, 13:25, "mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org" > > > > <mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org> wrote: > > > > Hello, > > > > > I habe a problem with the following code (shortened): > > > > > var Songlist = { > > > > initialize: function() { > > > > img = document.createElement(''img''); > > > > [...] > > > > img.observe(''mouseover'', this.mouseover); > > > > $(''body'').insert(img); > > > > } > > > > mouseover: function() { > > > > this.src = ''anotherimage.gif''; > > > > } > > > > > } > > > > > Songlist.initialize(); > > > > > Passing the image with my mouse I always get the error: "handler has > > > > no properties"! > > > > I would be happy if you gave me a tip, where what causes this error! > > > > > M. Hoffmann--~--~---------~--~----~------------~-------~--~----~ 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-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
img is declared globally which is not really good, try this: var Songlist = { initialize: function() { this.img = $(document.createElement(''img'')); this.img.observe(''mouseover'', Songlist.mouseover); $(''body'').insert(this.img); } mouseover: function() { this.src = ''anotherimage.gif''; } } Songlist.initialize(); - kangax On May 18, 9:46 am, "mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org" <mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org> wrote:> No problem. I read the texts you posted last time, so I think I now > know, > what "this" does :-) > This time I, of course, wanted to "this" to be the img to easily > change > the source. > > On 18 Mai, 15:36, "T.J. Crowder" <tjcrow...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote: > > > > ..."this" will be the window object, not an instance of Songlist. > > > Doh! Sorry, I forgot, it won''t be window, it''ll be the img element. > > I keep forgetting that Prototype''s event hooking stuff will default > > ''this'' in the handler to the element on which the event occurred. My > > bad, apologies. > > -- > > T.J. Crowder > > tj / crowder software / com > > > On May 18, 2:32 pm, "T.J. Crowder" <tjcrow...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote: > > > > Hi, > > > > No, that code probably doesn''t do what you mean it to do -- your code > > > hooking the event: > > > > > img.observe(''mouseover'', Songlist.mouseover); > > > > ...doesn''t preserve "this" (as we discussed in another thread). > > > Consequently when this code gets called: > > > > > mouseover: function() { > > > > this.src = ''anotherimage.gif''; > > > > } > > > > ..."this" will be the window object, not an instance of Songlist. > > > > It''s really worth stopping coding for a moment and reading up on how > > > "this" works in JavaScript. I''ve pointed you to this blog entry > > > before:http://blog.niftysnippets.org/2008/04/you-must-remember-this.html > > > > Additionally, Flanagan''s book will pay you back in time savings pretty > > > much any time you spend reading it:http://www.oreilly.com/catalog/jscript5/http://www.amazon.com/dp/0596... > > > > In terms of the actual problem with the above code, as with last time, > > > you want to use bindAsEventListener:http://www.prototypejs.org/api/function/bindAsEventListener > > > > Hope this helps, > > > -- > > > T.J. Crowder > > > tj / crowder software / com > > > On May 18, 12:31 pm, "mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org" > > > > <mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org> wrote: > > > > OK, I really tried hard before I posted the above message, but sitting > > > > on the toilet I found the mistake. > > > > The code must look like that, than it works: > > > > > var Songlist = { > > > > initialize: function() { > > > > img = document.createElement(''img''); > > > > [...] > > > > img.observe(''mouseover'', Songlist.mouseover); > > > > $(''body'').insert(img); > > > > } > > > > mouseover: function() { > > > > this.src = ''anotherimage.gif''; > > > > } > > > > > } > > > > > Songlist.initialize(); > > > > > On 18 Mai, 13:25, "mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org" > > > > > <mathis.hoffm...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org> wrote: > > > > > Hello, > > > > > > I habe a problem with the following code (shortened): > > > > > > var Songlist = { > > > > > initialize: function() { > > > > > img = document.createElement(''img''); > > > > > [...] > > > > > img.observe(''mouseover'', this.mouseover); > > > > > $(''body'').insert(img); > > > > > } > > > > > mouseover: function() { > > > > > this.src = ''anotherimage.gif''; > > > > > } > > > > > > } > > > > > > Songlist.initialize(); > > > > > > Passing the image with my mouse I always get the error: "handler has > > > > > no properties"! > > > > > I would be happy if you gave me a tip, where what causes this error! > > > > > > M. Hoffmann--~--~---------~--~----~------------~-------~--~----~ 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-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---