1

私はここに来たばかりで、html の折りたたみ可能なリストについて質問があります。「議事録」と「議題」のコレクションを保持する学校の Web サイト ページに折りたたみ可能なリストをコーディングする必要があります (これらは、サイトにアップロードされた単なる pdf ファイルです)。

私の課題は、ページが無限に長くならないように、それらすべてを折りたたみ可能なリストに入れることでした。新しい「ミニッツ」PDF と新しい「アジェンダ」PDF を毎月追加する予定なので、新しいファイルを含めるようにコードを編集します。

ウェブサイトへの参照と移動ボタンを含むドロップダウン メニューを作成しましたが、折りたたみ可能なリストについては行ったことがありません。私は 2 つの見出し (1 つは議事録用、もう 1 つはアジェンダ用) があると思います。そのいずれかをクリックすると、すべての 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

.show()および.hide()jQuery メソッドを とともに使用することもでき.click(function()ます。

于 2013-04-22T19:27:14.443 に答える