jquery slidetoggle不會保持切換

我想創建一個無序列表的jQuery滑動效果。它切換，但立即滑回。我無法弄清楚它是我的CSS還是它是我的jQuery。順便說一句，我無法得到這與我的jsfiddle出於某種原因工作，所以jsfiddle只是我的CSS，HTML和jQuery的一個視圖。這裏是我使用jQuery：jquery slidetoggle不會保持切換

function accordionLoad() { 

    $(".accordion-header").removeClass("expanded"); 
    $(".accordion-content").hide(); 

    $(".accordion-header").bind("click", function(){ 
     $(this).toggleClass("expanded"); 
     $(this).next(".accordion-content").slideToggle(); 
    }) 

    $(".expand-all").bind("click",function(){ 
     $(this).siblings(".accordion").find(".accordion-content").slideDown(); 
     $(this).siblings(".accordion").find(".accordion-header").addClass("expanded"); 
    }) 

    $(".collapse-all").bind("click",function(){ 
     $(this).siblings(".accordion").find(".accordion-content").slideUp(); 
     $(this).siblings(".accordion").find(".accordion-header").removeClass("expanded"); 
    }) 
} 

$(document).ready(function(){ 
    accordionLoad(); 
});

和HTML ..

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 

<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Untitled 1</title> 
<meta name="Microsoft Theme" content="HDRDefault 1011, default" /> 

</head> 
<body> 
<div class="container"> 
    <div class="expand-all">Expand All</div><div class="collapse-all">Collapse All</div> 
    <UL class="accordion"> 
    <LI class="accordion-item"> 
     <DIV class="accordion-header">Question2</DIV> 
     <DIV class="accordion-content"> 
     <DIV class="Externa">Answer2..Answer2..Answer2..Answer2..Answer2..Answer2..Answer2..</DIV>  
     </DIV> 
    </LI> 

    <LI class="accordion-item"> 
     <DIV class="accordion-header">Question12</DIV> 
     <DIV class="accordion-content"> 
     <DIV class="Externa">Answer12..Answer12..Answer12..Answer12..Answer12..Answer12..Answer12..</DIV>  
     </DIV> 
    </LI> 
    </UL> 
    </div> 
</body> 
</html>

這裏是的jsfiddle： http://jsfiddle.net/9CNeX/8/

來源

2013-01-08 Athapali

http://jsfiddle.net/9CNeX/9/ < - 忘了從框架下拉列表中選擇「jQuery」。你在那裏看到問題了嗎？ –

因此，這告訴我，我的代碼沒有任何問題，但我在一個實現此目的的SharePoint站點上滑動切換，但不保持切換..立即備份立即..有什麼可能導致此？ – Athapali

您是否還有另一塊與此相沖突的JavaScript？ –

見這個例子...

jsfiddle

$('.accordion-header').on('click', function(e){ 
    $(this).next().slideToggle(); 
});

問候。

來源

2013-01-09 12:58:29

jquery slidetoggle不會保持切換

回答

相關問題