ajouter un événement onclick sur divers éléments sur la base de la classe css

Question

J'ai différents éléments sur une seule page. Ils partagent une seule classe. Je souhaite ajouter un événement onclick sur tous les éléments utilisant un prototype.

Pour id je peux faire quelque chose comme this_

Event.observe(window, 'load', 
    function() { 
$('id_of_the_element').addEventListener('onclick',any_function,true); 
    } 
); 

Ce qui est bon si nous avons id de l'élément. Je veux faire la même chose en utilisant la classe css, car tous les éléments partagent la même classe.

Mise à jour:

document.observe("dom:loaded", function() { 
    $$('.message').invoke('observe', 'click', hide_all_messages) 
}); 

function hide_all_messages() 
{ 
$$('.message').hide(); 
} 

Ce ne fonctionne pas.

erreur:

hide is not a function 

Answer 1

$$('.myClass').each(
    function(element){ 
    Event.observe("click",element,any_function); 
} 
); 

vous l'avez!

Answer 2

une solution plus succincte serait d'utiliser invoke:

$$('.elements').invoke('observe', 'click', yourfunction) 

Vous pouvez définir cette option pour exécuter lorsque le dom est prêt en le plaçant dans ce code:

document.observe("dom:loaded", function() { 
    $$('.elements').invoke('observe', 'click', yourfunction) 
}); 

EDIT - cela corrigera votre autre problème:

function hide_all_messages(){ 
    $$('.message').invoke("hide"); 
}