0

それぞれを見つけるためのアンカーを持つページにたくさんのコンテンツがあります。アンカーは基本的にブックマークのようなもので、アンカーが導くコンテンツは hide(); を使用しました。最初の段落を除いて、それは単なる導入的なものであるため. 私の最終的な目標は次のとおりです。
アンカーをクリックすると、その 1 つの段落だけが再表示され、残りは非表示のままになります。次に、別のアンカーをクリックすると、前の段落が再び非表示になり、クリックしたばかりのアンカーされた段落のコンテンツのみが表示されます

私がこれまでに持っているもの（実際にはそれほど多くありません）は次のとおりです。 

                      $('#content p:not("#firstParagph")').toggle();`

.filter(':hidden') と show() を使用しようとしましたが、すべてのコードが壊れてしまいました (何か間違ったことをしていたからだと思います) 以前に動作させた方法は、 css コードは display:inline ですが、すべての css が既に存在するため、CSS を変更せずに実行したい

4

2 に答える 2

1

あなたはこのようなものを探しています:

HTML:

<div class="intro"> 
  <a href="intro">Intro</a>
  <p>intro</p>
</div>
<div class="first"> 
  <a href="#">1st</a>
  <p>First</p>
</div>
<div class="second">
  <a href="#">2nd</a>
  <p>Second</p>
</div>
<div class="third"> 
  <a href="#">3rd</a>
  <p>third</p>
</div>

Javascript:

$('p').hide();
$('.intro p').show();

$('a').on('click', function (e) {
   e.preventDefault();
   $('p').hide();
   $(this).closest('div').find('p').show();
});

これがフィドルです：http://jsfiddle.net/SznuP/

于 2013-10-01T21:39:09.420 に答える