JQuery show / hide

Résolu
Bonjour,
Comment "show - hide" une div en jQuery ou avec vanilla js ?

<div class="carte mx-2">
					<div class="carte-top">
						<h4 class="titre text-center">Grand-Père</h4>
					</div>
					<div class="card-body">
						<div class="carte-img">
							<img src="img/gris.png" alt="">
						</div>
						<div class="carte-body text-center">
							<h5 id="grandPere"></h5>
						</div>				  
					</div>
				</div>
				<div class="carte mx-2">
					<div class="carte-top">
						<h4 class="titre text-center">Grand-Mère</h4>
					</div>
					<div class="card-body">
						<div class="carte-img">
							<img src="img/grise.png" alt="">
						</div>
						<div class="carte-body text-center">
							<h5 id="grandMere"></h5>
						</div>				  			
					</div>
				</div>

Je veux afficher ou masquer la div "card-body" en cliquant sur la div "carte-top" utilisant "$(this)".

Merci à tous.

Cordialement

Configuration: Windows / Edge 103.0.1264.44

5 réponses

  1. Modérateur
    Bonjour,

    1 - Ta question concernant du javascript ... il eut été bien de la mettre dans le forum javascript ! (je la déplace)

    2 -
    Comment "show - hide" une div en jQuery

    La réponse est dans la question .... en utilisant les méthodes .show() ou .hide()

    utilisant "$(this)"

    Donc en fait, ta question c'est : comment "cibler" l'élément ayant la class card-body qui se trouve après l'élément cliqué
    pour ça, tu peux, en jquery, utiliser la méthode .parent() puis .find()
    0
    1. Merci,

      Un peu novice en jQuery, aurais tu vous un exemple de code.

      Merci,

      Cordialement,

      Chabinot
      0
      1. Modérateur
          $(".carte-top").click(function (){
              let card_body = $(this).parent().find('.card-body');
              card_body.toggle(); //on masque
          });
        

        0
        1. Merci beaucoup.
          0
          1. Modérateur

            Tu penseras à marquer la discussion en résolue.

            Merci.

            0
        2. D'accord, mais comment faire.

          0
          1. Modérateur

            Clique sur les trois petits points en dessous de ta question (premier message de cette discussion)

            Tu auras 'a possibilité de la mettre en résolue.

            0