Domanda

$(function() {
    $("table.section thead").click(function() {
      if ($(this).next("table.section tbody").style.display == "block"){
         $(this).next("table.section tbody").slideUp("slow");
      }
      if ($(this).next("table.section tbody").style.display == "none"){
         $(this).next("table.section tbody").slideDown("slow");
      }
    });
});

Non so come raggiungere questo obiettivo, qualsiasi aiuto sarebbe molto apprezzato.

UPDATE:

Stavo cercando di utilizzare la seguente funzione.

$(function() {
    $("table.section thead").click(function() {
    $(this).next("table.section tbody").slideToggle("slow");

    });
});

Il che mi dà un problema, (quando thead crollare e si fa clic su di esso, si espande e poi crollare di nuovo, quindi sarebbe sempre il collasso). È per questo che sto cercando di ottenere la funzione in alto.

È stato utile?

Soluzione

Con il selettore visibile in questo caso:

$(function() {
    $("table.section thead").click(function() {
      var body = $(this).next("table.section tbody");
      if (body.is(":visible"))
         body.slideUp("slow");
      else
         body.slideDown("slow");
    });
});

Ma probabilmente molto più semplice basta usare .slideToggle() in questo modo:

$(function() {
    $("table.section thead").click(function() {
      $(this).next("table.section tbody").slideToggle("slow");
    });
});
Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top