1

我是新来的,对 html 中的可折叠列表有疑问。我需要在学校网站页面上编写一个可折叠列表,其中包含“分钟”和“议程”的集合(它们只是已上传到网站的 pdf 文件)。

我的任务是将它们全部放在一个可折叠的列表中,这样页面就不会变得无限长。我们每个月都会添加一个新的“分钟”pdf 和一个新的“议程”pdf,所以我将只编辑代码以包含新文件。

我创建了一个下拉菜单,其中包含对网站的引用和一个 go 按钮,但从未使用过可折叠列表。我想我会有两个标题(一个用于分钟,一个用于议程)然后您单击其中一个,所有 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,我可以只输入文件的名称和扩展名,这样当您单击它时,它将启动去下载)。

4

2 回答 2

2

其实这没什么大不了的,如果你可以使用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-22T19:16:17.160 回答
0

您也可以将 the.show().hide()jQuery 方法与 the 一起使用.click(function()

于 2013-04-22T19:27:14.443 回答