howto install event handler

Discussion in 'Javascript' started by nstasiv@gmail.com, Aug 31, 2006.

  1. Guest

    Hello,
    the idea is to make object draggable with code like this

    var callout = new Callout(...);
    new Draggable(callout);
    where new Callout(...) adds some elements to DOM tree and new Draggale
    does the trick:

    function Draggable(_obj){
    this.obj = _obj;
    this.clickedX=0;
    this.clickedY=0;
    this.origX=0;
    this.origY=0;
    this.obj.onmousedown = function(evt){
    this.pickup(evt);
    }
    this.obj.onmouseup = function(evt){
    this.dropoff(evt);
    }
    this.obj.onmousemove = function(evt){
    this.givealift(evt);
    }
    }

    Draggable.prototype.givealift = function(evt)...
    Draggable.prototype.pickup = function(evt)...
    Draggable.prototype.dropdown = function(evt)...

    I used to install event handler with e.setAttribute("onmousedown",
    "pickup(evt)")
    and everything worked fine, then I made scripts in object oriented way
    but code
    this.obj.onmousedown = function(evt){
    this.pickup(evt);
    }
    won't work as expected, please help!

    Thank you
    Nazar
     
    , Aug 31, 2006
    #1
    1. Advertising

  2. wrote:
    <snip>
    > this.obj.onmousedown = function(evt){
    > this.pickup(evt);
    > }
    > won't work as expected, please help!


    In javascript the value of - this - is determined entirely by how a
    function is called and has no relationship with how or where code that
    uses it is declared/defined. When the browser calls an event handler
    assigned to an event handling property of an Element it calls that
    handler as a method of the Element, and so - this - is a reference to
    the Element.

    There are several techniques for associating DOM Element's event
    handlers with javascript object instances. Many are based upon
    closures:-

    <URL: http://jibbering.com/faq/faq_notes/closures.html >

    Richard.
     
    Richard Cornford, Aug 31, 2006
    #2
    1. Advertising

  3. Guest

    As I understand code

    this.ctl.getObject().addEventListener("mousedown",
    function(evt){this.pickup(evt);}, false);

    has the problem where this.pickup(evt); is called. Am I right?

    If there is no easy way to do the trick I will dig into closures
    subject. Thank you for help!

    Richard Cornford wrote:
    > wrote:
    > <snip>
    > > this.obj.onmousedown = function(evt){
    > > this.pickup(evt);
    > > }
    > > won't work as expected, please help!

    >
    > In javascript the value of - this - is determined entirely by how a
    > function is called and has no relationship with how or where code that
    > uses it is declared/defined. When the browser calls an event handler
    > assigned to an event handling property of an Element it calls that
    > handler as a method of the Element, and so - this - is a reference to
    > the Element.
    >
    > There are several techniques for associating DOM Element's event
    > handlers with javascript object instances. Many are based upon
    > closures:-
    >
    > <URL: http://jibbering.com/faq/faq_notes/closures.html >
    >
    > Richard.
     
    , Aug 31, 2006
    #3
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. sonic
    Replies:
    1
    Views:
    539
    John Saunders
    Jan 7, 2005
  2. Replies:
    1
    Views:
    710
    Damien
    Feb 22, 2007
  3. RC

    How to recall add event from an Event handler??

    RC, Jan 6, 2005, in forum: ASP .Net Web Controls
    Replies:
    1
    Views:
    266
    John Saunders
    Jan 6, 2005
  4. Adi
    Replies:
    2
    Views:
    193
  5. Replies:
    0
    Views:
    149
Loading...

Share This Page