create onChange in javascript issue

Question

I am trying to assign an change event to an element. I have

 var testDiv=getElementById('testDiv');

 var SelectMenu=document.createElement('select');
     SelectMenu.id='SelectMenu';
     SelectMenu.onchange=changeFuntion();

     testDiv.appendChild(SelectMenu);

function changeFuntion(){
 //it calls right after I load the page....
 alert('call');

}

html

  <div id='testDiv'></div>

I want the alert shown only when user change the dropdonw menu. However, it seems the alert is called right after the element is created. Any tips? Thanks a lot!

Sushanth -- · Accepted Answer · 2012-12-15 01:54:45Z

2

SelectMenu.onchange=changeFuntion();  <-- This calls the function
                                 ^^--- Remove the braces

supposed to be

SelectMenu.onchange=changeFuntion  ;  <-- This assigns the function pointer

Because of the braces the function is called immediately...

answered Dec 15, 2012 at 1:54

Sushanth --

55.8k9 gold badges70 silver badges109 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

MadSkunk · Accepted Answer · 2012-12-15 02:03:22Z

1

You are assigning the return value of the function changeFunction to SelectMenu.onchange, rather than the function itself. Try...

SelectMenu.onchange = changeFuntion;

Instead. The way you had it, i.e.:

SelectMenu.onchange = changeFuntion();

means: call the function changeFunction, and assign the return value to the SelectMenu.onchange property.

edited Dec 15, 2012 at 2:03

answered Dec 15, 2012 at 1:56

MadSkunk

3,8192 gold badges38 silver badges53 bronze badges

Collectives™ on Stack Overflow

create onChange in javascript issue

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related