Attaching an event to an anchor

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
User avatar
onion2k
Jedi Mod
Posts: 5263
Joined: Tue Dec 21, 2004 5:03 pm
Location: usrlab.com

Attaching an event to an anchor

Post by onion2k »

I need to attach an onclick event to an anchor. I've got some code working, but only in FF. IE is ignoring it.

Code: Select all

ea = document.createElement("a");
		ea.href = '#';
		ea.setAttribute('onclick','myFunction')');
		ea.appendChild(document.createTextNode('Click me'));
I need to replace "ea.setAttribute('onclick','myFunction')');" with something that will work across browsers, or I need to detect the browser the client is using and tailor the code for them. I've tried attachEvent() and it didn't work. The event kept firing without a click. Odd. Have anyone tried this sort of thing before?

(Note: I know I could use innerHTML, but I really, really don't want to leave the W3 DOM spec behind)
User avatar
Chris Corbyn
Breakbeat Nuttzer
Posts: 13098
Joined: Wed Mar 24, 2004 7:57 am
Location: Melbourne, Australia

Post by Chris Corbyn »

Code: Select all

if (document.captureEvents) document.captureEvents(Event.CLICK);
ea.onclick = myFunction;
User avatar
onion2k
Jedi Mod
Posts: 5263
Joined: Tue Dec 21, 2004 5:03 pm
Location: usrlab.com

Post by onion2k »

That seems to fire myFunction on every click event on the page. I need to specifically fire the event when ea is clicked.
User avatar
n00b Saibot
DevNet Resident
Posts: 1452
Joined: Fri Dec 24, 2004 2:59 am
Location: Lucknow, UP, India
Contact:

Post by n00b Saibot »

simple

Code: Select all

ea.onclick = myFunction;
will do it.
User avatar
onion2k
Jedi Mod
Posts: 5263
Joined: Tue Dec 21, 2004 5:03 pm
Location: usrlab.com

Post by onion2k »

n00b Saibot wrote:simple

Code: Select all

ea.onclick = myFunction;
will do it.
That nearly works, except the function gets called. If I do:

Code: Select all

ea.onclick = function() { myFunction; }
It works ok. I've a feeling nasty something like that causes a memory leak in IE though.

Next question, how can I pass parameters to myFunction? I need to generate these links in a loop, and call myFunction(x);, where x is the counter. So each link is to the same function but with a different number. It seems to make them all call the function with the same number if I use:

Code: Select all

	for (var h=0; h <= 5; h++) {

		ea = document.createElement("a");
		ea.href = '#';
		ea.onclick = function() { myFunction(h); }
		ea.appendChild(document.createTextNode(h+1));
	
		el = document.createElement("li");
		el.appendChild(ea);
		ul.appendChild(el);
	
	}
They all call myFunction(5).
User avatar
n00b Saibot
DevNet Resident
Posts: 1452
Joined: Fri Dec 24, 2004 2:59 am
Location: Lucknow, UP, India
Contact:

Post by n00b Saibot »

because they all aren't run until they have been assigned. once they are done assigning, they all run myFunction(h). now what is the final value of h, 5 :) so they all call 5.

I am sure I saw a workaround on Sitepoint & this is the one I posted:

Code: Select all

for (var h=0; h <= 5; h++)
{ 
  ea = document.createElement("a"); 
  ea.href = '#';
  ea.linkNo = h;
  ea.onclick = function() { myFunction(this.linkNo); } 
  ea.appendChild(document.createTextNode(h+1)); 
        
  el = document.createElement("li"); 
  el.appendChild(ea); 
  ul.appendChild(el); 
}
User avatar
onion2k
Jedi Mod
Posts: 5263
Joined: Tue Dec 21, 2004 5:03 pm
Location: usrlab.com

Post by onion2k »

Awesome, that works.

Do these anonymous functions that I'm attaching all over the place get removed from memory if I call removeChild(ea)? This is a small aspect of a big application, and I don't want to get a long way in and find I'm leaking memory all over the place.
User avatar
n00b Saibot
DevNet Resident
Posts: 1452
Joined: Fri Dec 24, 2004 2:59 am
Location: Lucknow, UP, India
Contact:

Post by n00b Saibot »

ever came across delete?

Code: Select all

delete ea.onclick;
removeChild(ea);
User avatar
onion2k
Jedi Mod
Posts: 5263
Joined: Tue Dec 21, 2004 5:03 pm
Location: usrlab.com

Post by onion2k »

n00b Saibot wrote:ever came across delete?
Actually I haven't. Thanks for pointing it out.
User avatar
n00b Saibot
DevNet Resident
Posts: 1452
Joined: Fri Dec 24, 2004 2:59 am
Location: Lucknow, UP, India
Contact:

Post by n00b Saibot »

onion2k wrote:
n00b Saibot wrote:ever came across delete?
Actually I haven't. Thanks for pointing it out.
I'm sorry if it came out as offence :oops:
Post Reply