Re: Variable scope problem

Collapse
This topic is closed.
X
X
 
  • Time
  • Show
Clear All
new posts
  • Jorge

    Re: Variable scope problem

    On Sep 28, 9:55 am, De_Dood <TimD...@gmail. comwrote:
    I'd like to access my "creationTi me" variable defined in my "show"
    function from within my onclick-event defined function.
    'creationTime' is not a variable, but a property of 'div1'.
    I've come so far to discover that the "this" in my onclick-event
    function points to the div element and not to one of the 'test'
    objects.
    Yes, that's the way it's suppossed to be. When you click on a 'div',
    'this' ought to point to the element in which you've clicked.
    But I can't find a solution on how to solve my problem.
    Can someone help me with this.
    This code:

    var div1 = new test();
    div1.show();

    is doing +/- this :

    div1= {}; //(an object)
    div1.creationTi me= ...;
    div1.show= function () { ... };
    ..
    div1.helloDiv= document.create Element("div");
    div1.helloDiv.o nclick= function () { ... };

    IOW:
    div1 is an object that has an attribute ('helloDiv'), an attribute
    ('creationTime' ), and a method ('show').
    hellodiv is a ('div') DOMElement that has an onclick handler (the
    'onclick' method).

    clicking on 'helloDiv' sets 'this' to helloDiv, not to div1. You ought
    to attach 'creationTime' to helloDiv instead:

    this.helloDiv.c reationTime = date.getTime();

    Or perhaps something like:

    <script>
    function divCreator (parent, inner) {
    var div= document.create Element("div");
    div.myParent= parent;
    div.inner= inner;
    div.show= function () {
    this.style.back groundColor= "red";
    this.style.bord erColor= "black";
    this.style.bord erStyle= "solid";
    this.style.bord erWidth= "1px";
    this.innerHTML= this.inner;
    this.creationTi me= (new Date()).getTime ()
    this.onclick= function () {
    alert(this.crea tionTime);
    };
    this.myParent.a ppendChild(this );
    return this;
    };
    return div;
    };
    function init () {
    var div1, div2;
    div1= divCreator(docu ment.body, 'div1');
    div1.show();
    div2= divCreator(docu ment.body, 'div2');
    div2.show();
    };
    </script>

    HTH,
    --
    Jorge
  • De_Dood

    #2
    Re: Variable scope problem

    On 28 sep, 12:05, Jorge <jo...@jorgecha morro.comwrote:
    On Sep 28, 9:55 am, De_Dood <TimD...@gmail. comwrote:
    >
    I'd like to access my "creationTi me" variable defined in my "show"
    function from within my onclick-event defined function.
    >
    'creationTime' is not a variable, but a property of 'div1'.
    >
    I've come so far to discover that the "this" in my onclick-event
    function points to the div element and not to one of the 'test'
    objects.
    >
    Yes, that's the way it's suppossed to be. When you click on a 'div',
    'this' ought to point to the element in which you've clicked.
    >
    But I can't find a solution on how to solve my problem.
    Can someone help me with this.
    >
    This code:
    >
    var div1 = new test();
    div1.show();
    >
    is doing +/- this :
    >
    div1= {}; //(an object)
    div1.creationTi me= ...;
    div1.show= function () { ... };
    .
    div1.helloDiv= document.create Element("div");
    div1.helloDiv.o nclick= function () { ... };
    >
    IOW:
    div1 is an object that has an attribute ('helloDiv'), an attribute
    ('creationTime' ), and a method ('show').
    hellodiv is a ('div') DOMElement that has an onclick handler (the
    'onclick' method).
    >
    clicking on 'helloDiv' sets 'this' to helloDiv, not to div1. You ought
    to attach 'creationTime' to helloDiv instead:
    >
    this.helloDiv.c reationTime = date.getTime();
    >
    Or perhaps something like:
    >
    <script>
    function divCreator (parent, inner) {
      var div= document.create Element("div");
      div.myParent= parent;
      div.inner= inner;
      div.show= function () {
        this.style.back groundColor= "red";
        this.style.bord erColor= "black";
        this.style.bord erStyle= "solid";
        this.style.bord erWidth= "1px";
        this.innerHTML= this.inner;
        this.creationTi me= (new Date()).getTime ()
        this.onclick= function () {
          alert(this.crea tionTime);
        };
        this.myParent.a ppendChild(this );
        return this;
      };
      return div;};
    >
    function init () {
      var div1, div2;
      div1= divCreator(docu ment.body, 'div1');
      div1.show();
      div2= divCreator(docu ment.body, 'div2');
      div2.show();};
    >
    </script>
    >
    HTH,
    --
    Jorge
    Thanks a lot for the clear answer. It will help me a lot.

    Kind regards,

    Tim De Graeve

    Comment

    Working...