jquery afficher/masquer div on click?

J'essaie d'utiliser jquery pour afficher et masquer un div onclick, et bien que je ne reçoive aucune erreur, il ne montre ni ne cache quoi que ce soit non plus.jquery afficher/masquer div on click?

** EDIT - MISE À JOUR **

$(document).ready(function() {  
     $("#nav-inner a").click(function() { 
      var type = $(this).attr("class"); 
       $("div.v1 > div").not("." + type).stop().hide().end().filter("." + type).stop().show(); 
       return false; 
    });

});

Voici le jquery:

$(document).ready(function() { 
     if($("#nav-inner")) { 
       $("#nav-inner ul li a").click(function(evt) { 
         var type = $(this).attr("class"); 
         var rowcount = 0; 
         $('div.v1 .vc').each(function(idx,el) { 
           if(type == 'typea') { 
            if($(el).hasClass('typea')) { 
               $(el).show(); 
             } else { 
               $(el).hide(); 
             } 
           } 
         }); 
        }); 
    } 
});

Et voici le balisage:

<div id="page"> 
    <div id="header"> 
     <div id="nav"> 
      <div id="nav-inner"> 
       <ul class="nav-inner-li"> 
        <li> 
         <a class="typea" href="#"><img src="/images/typea.png"></a> 
         <a class="typea" href="#">Type A</a> 
        </li> 
       </ul> 
      </div> 
     </div> 
    </div> 

    <div id="content"> 
     <div id="content-content"> 
      <div id="content-left"> 
       <div class="v1"> 
        <div class="vc"> 
         <div class="typea"> 
          <div class="title"> Title </div> 
          <div class="body"> Body </div> 
         </div> 

         <div class="typeb"> 
          <div class="title"> Title 2 </div> 
          <div class="body"> Body 2 </div> 
         </div> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 
</div>

Source

2010-02-10 phpN00b

Cela peut être beaucoup plus simple.

$(function() { 
    $("#nav-inner a").click(function() { 
    var type = $(this).attr("class"); 
    $("div.vc > div").not("." + type).stop().hide() 
     .end().filter("." + type).stop().show(); 
    return false; 
    }); 
});

Votre première erreur a été #nav-inner ul où #nav-inner est en fait l'élément ul. Ce qui précède attrape la classe à partir du lien cliqué, puis sélectionne l'enfant de div.v1 avec cette classe et le fait basculer (le montre s'il est caché, le cache sinon).

Source

2010-02-10 08:49:36 cletus

J'utilise toujours e.preventDefault() au lieu de fausse déclaration. Corrigez-moi si je me trompe, mais ne retourne pas false seulement annuler l'événement de l'élément courant? et preventDefault() arrête la chaîne d'événements? – fredrik

Merci ... Ça marche, en quelque sorte ... Sauf que j'ai besoin de tout cacher sauf les divs qui ont cette classe. Donc, en cliquant sur montre les div divs et cache tous les autres ... On dirait que c'est faire le contraire ...? – phpN00b

@fredrik: 'return false' est équivalent à' preventDefault() '** et **' stopPropagation() '. – cletus

Ceci est un simple exemple ..

<script> 
     $(document).ready(function(){ 
      $('#divtag').click(function(){ //use # for id and . for class 
       $('#insidetag').show();  // with parameters slow,fast, or a time in milisecond 
      });        // use toggle to show and hide 
     }); 
    </script> 

<body> 
    <div id="divtag"> 
     <div id="insidetag"> 
      Click the hide and show 
     </div> 
    </div> 
</body>

Source

2013-02-15 15:31:26 Gifted

Ton simple commentaire // utiliser # pour id et. pour la classe m'a sauvé des heures !! Merci doué! – Amod

jQuery(".user-profile-info").unbind().click(function(){ 
    if(jQuery(".user-profile-info").hasClass("collapsed")){ 
     jQuery('#user-profile-submenu').css('display', 'block'); 
     jQuery(".user-profile-info").removeClass("collapsed"); 
    } 
    else 
    {  
     jQuery(".user-profile-info").addClass("collapsed"); 
     jQuery('#user-profile-submenu').css('display', 'none'); 
    } 
});

Source

2016-11-30 10:48:33

Content of click

–

Répondre

Questions connexes