prototype event handler/listener

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
GeXus
Forum Regular
Posts: 631
Joined: Sat Mar 11, 2006 8:59 am

prototype event handler/listener

Post by GeXus »

I'm at square one, but this is what I would like to ultimately accomplish...

Have an event lister that calls a function onmouseover of all <a> elements within a specific div id, for example

Code: Select all

<div id="div1">
 <a href="#" id="o1">option 1</a>
 <a href="#" id="o2">option 2</a>
 <a href="#" id="o3">option 3</a>
</div>
Here I would want to have an onmouseover (or onclick) event that triggers a function passing the elements ID..

So, if a user mouses over the first link, it will call myFunction(id){} -- id being the ID of the <a> element moused over...

Any help would be amazing! Thank you :)
User avatar
feyd
Neighborhood Spidermoddy
Posts: 31559
Joined: Mon Mar 29, 2004 3:24 pm
Location: Bothell, Washington, USA

Post by feyd »

I'm not sure what your problem is.
GeXus
Forum Regular
Posts: 631
Joined: Sat Mar 11, 2006 8:59 am

Post by GeXus »

Well... I don't know how to have an event listener be attached only to <a> elements within the div is the #1... #2, I don't know how to have that event listener get the id of the <a> tag
User avatar
Weirdan
Moderator
Posts: 5978
Joined: Mon Nov 03, 2003 6:13 pm
Location: Odessa, Ukraine

Post by Weirdan »

Code: Select all

function doSomething(id) {
   alert('id is: ' + id);
}

$$('div.div1 a').each(function(elt) {
   Event.observe(elt, 'click', function(e) {
        doSomething(elt.id);
   });
});
GeXus
Forum Regular
Posts: 631
Joined: Sat Mar 11, 2006 8:59 am

Post by GeXus »

Weirdan wrote:

Code: Select all

function doSomething(id) {
   alert('id is: ' + id);
}

$$('div.div1 a').each(function(elt) {
   Event.observe(elt, 'click', function(e) {
        doSomething(elt.id);
   });
});
Sweet.. do I have to put that inside anything particular? It doesn't work as-is....
User avatar
Kieran Huggins
DevNet Master
Posts: 3635
Joined: Wed Dec 06, 2006 4:14 pm
Location: Toronto, Canada
Contact:

Post by Kieran Huggins »

jQuery to the rescue!

You must include jQuery, then:

Code: Select all

$('div.div1 a').mouseover(function(){
   yourFunctionName($(this).attr('id'));
})
Post Reply