CODEWITHSUNDEEP
javascriptloopsonclick
Pori
Pori

Reputation: 696

Applying onClick to Element Array in a For Loop

I am trying to apply an onClick event to an array of elements in a document, like this:

for (var i = 0; i < myElems.length; i++)
     myElems[i].onClick = "someFunction(this)";

The code is placed inside of an init() function for the onLoad event of the body tag. I notice that when the document loads, the functions wont work.

I've noticed, that if I add an alert() to tell me if the function is the problem:

for (var i = 0; i < myElems.length; i++)
     myElems[i].onClick = "alert('It worked!')";

The document will load and perform the alert for all of the elements, without ever taking into consideration whether or not I actually clicked the element.

What am I doing wrong?

Upvotes: 5

Views: 11057

Answers (2)

David Hoerster
David Hoerster

Reputation: 28701

You need to assign the 'onclick' handler to a function:

for (var i = 0; i < myElems.length; i++)
     myElems[i].onclick = function() { someFunction(this);};

Assigning your 'alert' call directly will fire it (as you're seeing). What you want to do is assign your handler to a function that will be called when the event is fired.

Upvotes: 3

Fabr&#237;cio Matt&#233;
Fabr&#237;cio Matt&#233;

Reputation: 70139

The property name is onclick.

onClick even though being valid HTML, does not exist in JS as it is case-sensitive.

Also you have to assign it a function reference or expression as David answered (+1).

Fiddle

Upvotes: 2

Related Questions