Connecting Tech Pros Worldwide Help | Site Map

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

Christoph
Guest
 
Posts: n/a
#1: July 20th, 2005, 12:47 PM
newFieldElement = document.createElement( 'INPUT' );
newFieldElement.onblur = new Function( "calculatePremiumOptionTotal( 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


Mike
Guest
 
Posts: n/a
#2: July 20th, 2005, 12:47 PM

re: What's wrong with this "new Function()" 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.value);
}

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="javascript">
function init(){
newFieldElement = document.createElement( 'INPUT' );
newFieldElement.onblur = show;
document.body.appendChild(newFieldElement);

newFieldElement1 = document.createElement( 'INPUT' );
newFieldElement1.onblur = show;
document.body.appendChild(newFieldElement1);
}
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@monger.newsread.com...[color=blue]
> newFieldElement = document.createElement( 'INPUT' );
> newFieldElement.onblur = new Function( "calculatePremiumOptionTotal([/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]


Closed Thread


Similar Threads
Thread Thread Starter Forum Replies Last Post
Can I know if "new Func()" or "Func()" is called? jht5945@gmail.com answers 37 October 14th, 2006 10:05 PM
Why do I require an "elif" statement here? Jim answers 13 August 16th, 2006 12:25 AM
PEP 359: The "make" Statement Steven Bethard answers 28 April 18th, 2006 08:05 PM
Suggesting a new feature - "Inverse Generators" Jordan Rastrick answers 15 July 19th, 2005 12:08 AM