我正在嘗試將一些jQuery UI組件添加到我公司的html輸出中以獲取用戶文檔。我用JavaScript很少有經驗。我得到了手風琴爲表格行工作,但現在我想展開和摺疊子步驟下一個有序列表內的有序列表,但似乎無法使其工作。對不起,如果答案很簡單,請幫助我!有序列表中的jQuery UI手風琴
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Accordion - Collapse content</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css" />
<script>
$(function() {
$(".sub li:not(.accordion)").hide();
$(".sub li:first-child").show();
$(".sub li.accordion").click(function(){
$(this).nextAll("li").fadeToggle(500);
}).eq(0).trigger('click');
});
</script>
</head>
<body>
<ol class="sub">
<li class="accordion">Section 1</li>
<ol>
<li>Description</li>
<li>This is text within section 1.</li>
</ol>
<li class="accordion">Section 2</li>
<ol>
<li>Description</li>
<li>This is text within section 2.</li>
</ol>
</ol>
</body>
</html>
它最初應該只顯示「第1部分」和「第2部分」,並且當您單擊每個顯示的子步時? –
是的,我知道這個例子並不是最好的,但是當你點擊第1部分或第2部分時,它會顯示它下面的有序列表。它應該顯示1.第1部分,並且有1.描述和2.這是在它下面的第1部分中的文本。 – ernstja