[Résolu] Connaître l' id d'un bloc cliqué

HTML5, CSS3, Javascript, support des mobiles... Que penser de votre site ? Vous manquez d'informations pour la construction d'un site qui puisse s'afficher correctement partout ? C'est un problème simple, un peu complexe ? Venez ici !
Ymai
Tyrannosaurus Rex
Messages : 4220
Inscription : 12 mars 2005, 11:36

[Résolu] Connaître l' id d'un bloc cliqué

Message par Ymai »

Bonjour
Soit une page contenant le code suivant:

Code : Tout sélectionner

<ul>
<li id="bloc1" class="bloc" onclick="javascript:clique()">blabla</li>
<li id="bloc2" class="bloc" onclick="javascript:clique()">blabla</li>
<li id="bloc3" class="bloc" onclick="javascript:clique()">blabla</li>
</li>
et la fonction

Code : Tout sélectionner

function clique()
{
....
return (noBloc);
}
qui devrait retourner le numéro du bloc qui a été cliqué.

Je sèche sur la méthode à adopter pour que la fonction "clique()" retourne ce numéro.
Je pourrais, évidemment, coder quelque chose du genre

Code : Tout sélectionner

<li id="bloc2" class="bloc" onclick="javascript:clique('2')">blabla</li>
dans quel cas la fonction est triviale.

A mon sens, la solution serait que la fonction reçoive l' id du bloc cliqué en argument. Il n'est pas difficile d'en extraire le numéro.
La question est donc: quel argument faut-il passer dans
onclick="javascript:clique(argument)" ?
J'avais pensé à quelque chose comme
onclick="javascript:clique(self)"
qui ne fonctionne bien sûr pas.

Le problème, mis en situation, à l'adresse http://www.sio2.be/demo/onglets.html

Il y a bien sûr quelques éminences grises dans la salle...
Merci pour tout tuyau.
Dernière modification par Ymai le 15 juin 2007, 13:00, modifié 1 fois.
ymai
« Un enfant de cinq ans comprendrait cela ! Allez me chercher un enfant de cinq ans ! »
Groucho Marx.
calimo
Animal mythique
Messages : 14118
Inscription : 26 déc. 2003, 11:51

Re: Connaître l' id d'un bloc cliqué

Message par calimo »

Ymai a écrit :onclick="javascript:clique(self)".

Code : Tout sélectionner

onclick="javascript:clique(this)"
(this et pas self)

Ensuite dans la fonction :

Code : Tout sélectionner

function clique(li) {
var id = li.id;
(...)
}
Juste une chose, au niveau de l'accessibilité :
  1. ca ne fonctionne pas pour ceux qui n'utilisent pas la souris (clavier). Il faudrait utiliser des liens à la place, histoire qu'ils puissent gagner le focus... ;
  2. L'utilisation de liens permettrait de faire des liens internes pour ceux qui auraient javascript désactivé et pourraient se rendre directement au bon endroit... !
:wink:

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.4) Gecko/20070515 Firefox/2.0.0.4
Ymai
Tyrannosaurus Rex
Messages : 4220
Inscription : 12 mars 2005, 11:36

Message par Ymai »

Merci pour tous ces détails

Au niveau de l'accessibilité, les onglets seront visibles par défaut et vont donc s'afficher l'un en dessous de l'autre. Je les cacherai dans un "<body onload...".
Il s'agit d'une application développée pour des besoins internes. Javascript est obligatoire pour d'autres fonctions. Donc, pas trop de soucis de mon coté quand même.

Bien noté pour les liens.
ymai
« Un enfant de cinq ans comprendrait cela ! Allez me chercher un enfant de cinq ans ! »
Groucho Marx.
Répondre

Qui est en ligne ?

Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 4 invités