1

ユーザーが記事のヘッダーをクリックすると、その下に非表示の段落スニペットが表示されてフェードインするイベントをトリガーしようとしています。私の問題は、1 つのヘッダーをクリックするたびにすべての段落は他のすべてのヘッダーの下に表示されます。クリックしたヘッダーの段落をトリガーするにはどうすればよいですか? HTMLコードは次のとおりです。

    <div id="content">
    <div class="column">
    <div class="Article">
    <img src="images/SteveJobs.png" alt="Steve Jobs" Title="SteveJobs" />
    <h1><a href="#"> Computers changed Forever</a></h1>
    <p> The Brilliant Mind of Steve Jobs. </p>
    </div>
    <div class="Article">
    <img src="images/Cannibal.png" alt="Cannibal" Title="Randy Cannibal" />
    <h1><a href="#"> Face-Eating Cannibal Attack May Be Latest in String of 'Bath Salts'        Incidents</a></h1>
    <p> On May 26, Miami police shot and killed a homeless man who was allegedly feasting on the face of another homeless man in a daylight attack on a busy highway.  </p>
    </div>
    </div>
    </div>

ジャバスクリプトはこちら

    <script type="text/javascript">
       $(document).ready(function() { 
      $('.Article h1 a').click(function() {
     $('.Article p').each(function() {
         $(this).fadeIn(3000).show();
            });
           });
         });
     </script>
4

2 に答える 2

2 
$('.Article h1 a').click(function(event) {
     event.preventDefault();
     $(this.parentNode).next('p').fadeToggle(3000);
     // $(this).closest('.Article').find('p').fadeIn(3000);
});
于 2013-05-18T00:26:18.517 に答える