What's wrong with this "new Function()" statement?

Collapse
This topic is closed.
X
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • Christoph
    #1

    What's wrong with this "new Function()" statement?

    newFieldElement = document.create Element( 'INPUT' );
    newFieldElement .onblur = new Function( "calculatePremi umOptionTotal( this );" );

    In my (dynamically generated) javascript, I've never had a problem with
    attaching a function to an event using the above. However, what's going
    on with the above is that the reference to the element object (this) isn't
    being passed to my function. When I do an alert on the argument within
    the function, I'm getting undefined.
    Are you not allowed to pass 'this' reference when attaching a function to
    an event as exampled above?

    Any insight would be greatly appreciated!

    thnx,
    Christoph


    Tags: None
    • Mike
      #2
      Re: What's wrong with this "new Function()&quot ; statement?

      Creating annonymous functions for event handlers is not really a good way to
      go. It works fine but can get you into trouble.

      I'll give you 2 solutions. One that uses an annonymous function and another
      that I think is cleaner and does not.

      option 1:
      newFieldElement .onblur = function() { alert( this.value );};

      option 2:
      newFieldElement .onblur = show;
      function show(){
      alert(this.valu e);
      }

      The reason I prefer option 2 is that for every element you create an event
      handler for using option 1 you are going to create a duplicate annonymous
      function. So if you create 5 input fields with this blur event you are going
      to create 5 annonymous functions that do exactly the same thing. With option
      2 you only will have one instance of the event handler function that is
      referenced by 5 input elements. On screen where you have a lot of elements
      this will improve your system's performance.

      Are you scratching you head wondering if option 2 even really works? Run the
      following test it works.

      <html>
      <head>
      <script language="javas cript">
      function init(){
      newFieldElement = document.create Element( 'INPUT' );
      newFieldElement .onblur = show;
      document.body.a ppendChild(newF ieldElement);

      newFieldElement 1 = document.create Element( 'INPUT' );
      newFieldElement 1.onblur = show;
      document.body.a ppendChild(newF ieldElement1);
      }
      function show(){
      alert( this.value );
      }
      </script>
      </head>
      <body onload="init()" >
      </body>
      </html>


      Mike

      "Christoph" <jcboget@yahoo. com> wrote in message
      news:tibsb.614$ Ob3.651522@mong er.newsread.com ...[color=blue]
      > newFieldElement = document.create Element( 'INPUT' );
      > newFieldElement .onblur = new Function( "calculatePremi umOptionTotal([/color]
      this );" );[color=blue]
      >
      > In my (dynamically generated) javascript, I've never had a problem with
      > attaching a function to an event using the above. However, what's going
      > on with the above is that the reference to the element object (this) isn't
      > being passed to my function. When I do an alert on the argument within
      > the function, I'm getting undefined.
      > Are you not allowed to pass 'this' reference when attaching a function to
      > an event as exampled above?
      >
      > Any insight would be greatly appreciated!
      >
      > thnx,
      > Christoph
      >
      >[/color]


        Comment

        Previous template Next
        Working...