Accordéon en mesure d'afficher tous mais j'ai seulement besoin d'un ouvert à la fois

Question

Première chose d'abord. Joyeux Noël. J'utilise un script d'accordéon au http://bootsnipp.com/snippets/4OlpK, ce qui est très bien jusqu'à présent. Cependant, j'ai besoin de l'option de réduction quand une option d'accordéon est cliquée. Pour l'instant, tout peut être ouvert. J'ai seulement besoin d'une option d'accordéon pour être ouverte à la fois.

Aide.

Answer 1

changement que vous Js fonctionnez comme ci-dessous, il fonctionnera

$(function() { 
    $(".expand").on("click", function() { 
    $(".expand").find(">:first-child").text("+"); 
    $(".detail").css("display","none"); 
    $(this).next().slideToggle(200); 
    $expand = $(this).find(">:first-child"); 

    if($expand.text() == "+") { 
     $expand.text("-"); 
    } else { 
     $expand.text("+"); 
    } 
    }); 
}); 

Trouver cette fiddle.

Answer 2

Remplacez votre javascript avec ceci:

$(function() { 
    $(".expand").on("click", function() { 
    if($(this).next().css("display")=="none"){ 
     $(".expand").next().css("display","none"); 
     $expandold = $(".expand").find(">:first-child"); 
     $expandold.text("+"); 
     $(this).next().slideToggle(200); 
     $expand = $(this).find(">:first-child"); 
     $expand.text("-"); 
    } 
    else{ 
     $(".expand").next().css("display","none"); 
     $expand = $(this).find(">:first-child"); 
     $expand.text("+"); 
    } 

    }); 
}); 

est ici un travail codepen

Answer 3

Ce serait une solution en utilisant la méthode slideUp.

$(function() { 
    $(".expand").on("click", function() { 
    $('.detail').not($(this).next()).slideUp().prev().find(">:first-child").each(function(){ 
     $(this).text("+"); 
    }); 

    $(this).next().slideToggle(200); 
    $expand = $(this).find(">:first-child"); 

    if($expand.text() == "+") { 
     $expand.text("-"); 
    } else { 
     $expand.text("+"); 
    } 
    }); 
});