Discussion :

[Rafapouf]

Bonjour,

je suis plutôt novice en Jquery, j'arrive à sélectionner des class et à leur donner quelque chose à faire ( ici cacher/montrer un lien et cacher/montrer du texte )

Seulement j'ai plusieurs liens et textes qui font la même chose. Je sais qu'on peut les selectionner en appelant la div au dessus et derriere chopper le selecteur cliqué via $this. Mais je n'y arrive pas, je pense que mon demarrage est mauvais.
Si quelqu'un pouvait m'aiguiller ce serait super !

Voila mon code :

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
  $('.146texte').hide();$('.146lien').hide();$('.152texte').hide();$('.152lien').hide();  
 
$('a.146').click(function() {
    $('.146texte').slideToggle(400);
    $('.146lien').slideToggle(400);
	$('a.146').hide();
		return false;
  });
   $('.146lien').click(function() {
    $('.146texte').slideToggle(400);
		$('.146lien').hide();
		$('a.146').slideToggle(400);
		return false;
  });
 
    $('a.152').click(function() {
    $('.152texte').slideToggle(400);
    $('.152lien').slideToggle(400);
	$('a.152').hide();
		return false;
  });
   $('.152lien').click(function() {
    $('.152texte').slideToggle(400);
		$('.152lien').hide();
		$('a.152').slideToggle(400);
		return false;
  });

et mon html

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<div class="entry">'.$chaine1.'</div><div class="'.$id.'texte" style="display:none;"><p class="groupetexte">'.$chaine2.'</p></div>

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<span class="readmore"><a class="<?php echo $page->ID ;?>" name="lire" href="#" ><?php echo __('LIRE LA SUITE <span class="rouge"><b>+</b></span>');?></a><a class="<?php echo $page->ID ;?>lien" href="#" ><?php echo __('FERMER');?></a></span> <div class="clr"></div>

[marcha]

Salut,

Tu utilise JQuery comme un document.getElementById mais avec des classes.

Un des intérêts de JQuery c'est qu'il travail avec des listes.

Au lieu de

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$('.146texte').hide();$('.146lien').hide();$('.152texte').hide();$('.152lien').hide();

Applique une classe à tous les éléments que tu veux cacher et écrit simplement:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$('.cachable').hide();

$('.cachable') représente une liste d'éléments et $('.cachable').hide() appelle la fonction hide() pour chaqu'un d'entre eux.

Je te recommande de regarder quelques tutos d'introduction à JQuery.
Par exemple celui-ci

[Rafapouf]

Yes ! Merci pour le tuto !

Par contre pour l'utilisation des classes, je ne peux justement pas mettre une classe identique à tous ( du coup j'aurais pu travailler avec des id en fait ) parce que tout les élements sont sur la même page. Du coup si je cache ou decache la classe, chaque lien va se cacher/decacher alors qu'il faut que ce soit seulement celui cliqué !
C'est pour ça que je veux utiliser $(this)

[SpaceFrog]

sinon avec un selecteur multiple

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$('.146texte, .146lien, .152texte, .152lien').hide();

[marcha]

Tu peux cumuler les classes

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
<div class="146texte cachable" style="display:none;">
<div class="152texte cachable" style="display:none;">

[Rafapouf]

Oui je comprends ça, je sais que je peux cumuler les class.
Le problème reste le même !
La j'ai deux liens et deux textes à cacher. Du coup c'est faisable à la main en entrant chaque id de chaque texte, mais le jour ou j'en ai 100 ! je vais pas entrer les 100 à la main ! Et j'aimerais "automatiser" la chose, que chaque fois que je rajoute un texte, je n'ai pas à rajouter une ligne de Jquery.