HTML可摺疊列表與文件引用

我在這裏是新的，並有一個關於可摺疊列表在html中的問題。我需要在學校網頁上編寫一個可摺疊列表，其中包含「Minutes」和「Agendas」（他們只是已上傳到網站的pdf文件）。HTML可摺疊列表與文件引用

我的任務是將它們全部放入可摺疊列表中，以便頁面不會無限期地變長。我們將每月增加一個新的「分鐘」pdf和一個新的「議程」pdf，因此我將編輯代碼以包含新文件。

我已經創建了一個下拉菜單，其中引用了網站和go按鈕，但從未涉及可摺疊列表。我想我會有兩個標題（一個用於分鐘，一個用於Agendas），然後單擊其中一個，所有的pdf文檔將按時間順序顯示。

如果您要點擊pdf鏈接，它應該下載，因爲它現在就是它在頁面上的樣子。我試圖儘可能詳細地說明我正在努力達成的目標。

新的編輯這裏是我現在的4/23，只要：

<script type="text/javascript"> 
//<![CDATA[ 
function toggle(divName){ 
if(document.getElementById) 
{ 
var theDiv = document.getElementById(divName); 
if(theDiv) 
{ 
if(theDiv.style.display == 'none') 
{ 
theDiv.style.display = 'block'; 
} 
else 
{ 
theDiv.style.display = 'none'; 
} 
} 
} 
} 
//]]> 
</script> 
<ul> 
<li><a href="javascript:toggle('Minutes')">Advisory Board Minutes</a> 
<ul id="Minutes"> 
<li><a href="http://www.cnn.com">Advisory Board Minutes 1</li></a> 
<li>Advisory Board Minutes 2</li> 
<li>Advisory Board Minutes 3</li> 
</ul> 
</li> 
<li><a href="javascript:toggle('Agendas')">Advisory Board Agendas</a> 
<ul id="Agendas"> 
<li>Advisory Board Agenda 1</li> 
<li>Advisory Board Agenda 2</li> 
<li>Advisory Board Agenda 3</li> 
</ul> 
</li> 
</ul>

現在我的問題是如何使列表「塌」而不是「擴展」的頁面加載時因爲它現在顯示已經'擴展'了？另外，如何鏈接分鐘或議程中的元素（即顧問委員會會議記錄1，而不是http://www.ccn.com，我可以只鍵入文件的名稱和擴展名，因此當您單擊它時，它將開始下載）。

來源

2013-04-22 Joseph Ouellette

你自己試過了嗎？ – 2013-04-22 18:29:58

**嘗試自己寫一些東西**，然後如果它不起作用，請帶給我們幫助你。你開始吧，我們幫忙。我們不會爲你寫信。向我們展示您嘗試過的實際代碼，然後我們可以從那裏幫助您。如果你只是先嚐試一下，你很可能會接近答案。 – 2013-04-22 18:30:27

這聽起來像你正在尋找JQuery手風琴http://jqueryui.com/accordion/ – 2013-04-22 18:31:08

這實際上並不是什麼大不了的，如果你確定使用jQuery。
事情是這樣的：

$('#Minutes > li').click(function() { 
    $('#Minutes ul').not($(this).find('ul')).stop(true,true).slideUp(); 
    $(this).find('ul').stop(true,true).slideDown(); list item 
});

我已經包括在什麼每一行做小提琴的意見。 http://jsfiddle.net/tgs2x/

來源

2013-04-22 19:16:17 Kaloyan

您也可以使用.show()和.hide() jQuery方法與.click(function()爲好。

來源

2013-04-22 19:27:14

HTML可摺疊列表與文件引用

回答

相關問題