[Résolu] Exécuter un affichage sur valeur d'une variable

Bonjour,

J’ai déjà formulé ce sujet sur le forum, mais il n’a pas obtenu de réponses, c’est pourquoi je le reformule en espérant un meilleur succès.
Le script suivant permet par clic sur l’image « fleche_bas.png » de déplier (ouvrir), ou par un clic sur l’image « fleche_haut.png » de replier (fermer), tous les éléments sous balise h2 de la class="trigger"d’une page .
Un clic sur une balise h2 de la class="trigger" permet de déplier ou de replier les éléments disposés sous la balise h2 cliqué

Je souhaiterai ajouter une fonction qui permettrait de déployer tous les éléments h2 de la page en fonction d’une variable si elle est égale par exemple à oui (ouvrir).

Je ne suis pas très affûté sur le javascript, c’est la raison qui me pousse à demander de l’aide

Merci
Meilleures salutations

Le code HTML

<a id="ouvrir" href="#"><img src="../image/fleche_bas.png" class="ligne" alt=""></a>&nbsp;&nbsp;<a id="fermer" href="#"><img src="../image/fleche_haut.png" class="ligne" alt=""></a>

<h2 class="trigger"> <a href="#"><img src="../image/fleche_bas.png" class="ligne" alt="">&nbsp;&nbsp;<img src="../image/fleche_haut.png" class="ligne" alt="">&nbsp;Annuaire 
  des anciens de Maizières-lès-Metz</a></h2>
<section class="toggle_container"> 
<?php include("../page_membre/annuaire_maizieres.inc.php");?>
</section> 
<h2 class="trigger"> <a href="#"><img src="../image/fleche_bas.png" class="ligne" alt="">&nbsp;&nbsp;<img src="../image/fleche_haut.png" class="ligne" alt="">&nbsp;Annuaire 
  des anciens de St Germain en Laye</a></h2>
<section class="toggle_container"> 
<?php include("../page_membre/annuaire_st_germain.inc.php");?>
</section>

Le script

<script>
$(document).ready(function(){
    var $contenu = $('.toggle_container');
    $contenu.hide();
 
    $('h2.trigger').click(function(){
        $(this).toggleClass('active').next().slideToggle('slow');
        return false;
    });
     
    $('#ouvrir').click(function() {
        $contenu.show('slow');
        return false;
    });
     
    $('#fermer').click(function() {
        $contenu.hide('slow');
        return false;
    });
});
</script>

Salut,

Je comprend pas bien ce que tu veux faire...

pmara a écrit :
Un clic sur une balise h2 de la class="trigger" permet de déplier ou de replier les éléments disposés sous la balise h2 cliqué

Ca ok c'est ce que tu as fait. Quand tu cliques sur la fleche ca ouvre tout, et si tu clique sur un h2 ca ouvre le contenu qui suit.

pmara a écrit :
Je souhaiterai ajouter une fonction qui permettrait de déployer tous les éléments h2 de la page en fonction d’une variable si elle est égale par exemple à oui (ouvrir).

C'est pas ce que tu as déjà ?

[EDIT]
Ah attends, je crois que j'ai choppé la nuance

pmara a écrit :
déployer tous les éléments h2

tu veux afficher/masquer les h2 eux même et pas le contenu c'est ça ?? Et tu bloque ou du coup ? C'est la meme chose que pour la fleche et les contenus mais avec un autre élément et les h2
Modifié par _laurent (06 Feb 2020 - 15:33)

Bonjour,

Merci de vous intéresser à mon sujet.

Le script actuel permet de déplier replier tous les h2 de la page par un clic sur les flèches.
Je voudrai ajouter la fonction qui ne passerait pas par un clic (action physique au clavier) mais par un test sur la valeur d'une variable initiée par ailleurs (sans action physique au clavier).

Est-ce plus clair ?

Cordialement
Patrick Mara

Ah oui effectivement, merci.

Bah du coup, si l'init et le contrôle de la variable se fait ailleurs, ici je dirais un simple "if" :

if ($variable) {
     $contenu.hide('slow');
}

non ?

Bonjour,

J'ai finalement résolu mon problème en cherchant sur le net. En fait il faut réaliser ce qui est appelé un auto click.

Pour se faire il faut ajouter [0] devant .click(function(), il existe d'autres solutions.
Mon script est finalement le suivant sachant que l'ouverture de tous les h2 d'une page est déclenché si myVariable est égal à 1

$('#ouvrir').click(function() {
        $contenu.show('slow');
        return false;
    });

if (myVariable == 1) {
     $('#ouvrir')[0].click(function(){
       $contenu.show('slow');
       return false;
	});      
}

Cordialement

Bonjour,

Pour exécuter un code sous condition , il est bien nécessaire de le placer dans un IF !!!
J'ai testé la solution présentée et elle fonctionne.

Cordialement

Salut

Tant mieux si tu as trouvé ta solution, mais je me dois de faire quelques commentaires :

$('#ouvrir').click(function() {
        $contenu.show('slow');
        return false;
    });

if (myVariable == 1) {
     $('#ouvrir')[0].click(function(){
       $contenu.show('slow');
       return false;
	});      
}

- Euh..... Si tu as besoin de faire $('#ouvrir')[0] c'est qu'il y a un gros problème.
Un ID est unique, et même pour une classe, quand on fait un event sur un élement, il n'y a absolument pas besoin de mettre de [0] je suis quasi sûr que tu as une erreur console.
- je ne comprend pas pourquoi tu as "deux" event click, un conditionner, l'autre non.
les conditions se mettent à l'intérieur de l'event, pas avant.
- pour ta fermeture/ouverture tu fais deux choses :

$('#ouvrir').click(function() {
        $contenu.show('slow');
        return false;
    });
     
    $('#fermer').click(function() {
        $contenu.hide('slow');
        return false;
    });

alors qu'un $contenu.toggle(), suffirait.

Bonjour,

Je me permet de rappeler que le code présenté fonctionne sans provoquer de message d'erreur.
Je ne suis pas une lumière en javascript, c'est pourquoi je approvisionne en code java sur le net, en prenant la précaution de bien tester et parfois d'ajouter ma touche personnelle.

Ceci dit mon code ne se lit pas : ('#ouvrir')[0] mais comme [0].click

Le [0] devant .click indique que le click se fait automatiquement sans action physique sur le clavier.

Cordialement

Bonjour Jencal,

Je viens de constater que tu as posté sur ce forum sur le click automatique d'un bouton.
Aurais-tu une idée pour faire un clic automatique sur un lien <a href> ?

Sinon je vais créer un nouveau sujet sur ce forum.

Cordialement

J'ai pas compris, tu as déjà dit que Le [0] devant .click indique que le click se fait automatiquement sans action physique sur le clavier.
Mais tu demandes par la suite comment faire le click automatique ?
Mais tu as déjà répondu à cela.

Non c'est la même chose, que ce soit un lien, un champs, un titre, un bouton.... dans tout les cas il faut cibler...

$("LA CIBLE HREF")[0].click()

Modifié par JENCAL (10 Feb 2020 - 15:37)

pmara a écrit :
Je suis un peu perdu.
Je met quoi dans LA CIBLE HREF ?

Il faut mettre le selecteur, soit la classe soit l'ID de votre lien. pour le cibler.

Voilà ce que j'ai fait :

<script>
$("lien")[0].click();
</script>

<a id="lien" href="#bull_60">Vers bull_60</a>

<h2 id="bull_60" class="trigger">........

Mais ç'a ne fonctionne pas.

Merci pour les explications relatives à la sélection d'une ID et d'une CLASS.

C'a ne fonctionne toujours pas après la correction :

$("#lien")[0].click();

Désolé de prendre de votre temps mais je voudrais trouver une solution.