1

jQuery を使用して、1 つの HTML ページに複数のフライアウトを作成したいと考えています。以下のコードを見てください。

<div>123
    <p style="display:none">
        <a href="#">1</a>
        <a href="#">2</a>
        <a href="#">3</a>
    </p>
</div>
<div>ABC
    <p style="display:none">
        <a href="#">a</a>
        <a href="#">b</a>
        <a href="#">c</a>
    </p>
</div>

今のところ、コンテンツが異なる div は 2 つだけです。divがクリックされたときに、pタグ（その中にネストされている）を表示/非表示にしたい。

私のjqueryの知識は非常に限られており、それを達成するために私のjqueryコードは次のようになっています。

<script>
$(document).ready(function(){
  $("div").click(function(){
    $(this p).toggle();
  });
}); 
</script>

もちろん、これは機能していません。また、同じページに 2 つ以上の div がある場合もあり、同様のポップアップが表示されます。

これを達成するにはどうすればよいですか？

どんな助けでも大歓迎です。

期待して感謝します。

よろしくパルベスA.

4

1 に答える 1

0

HTML の調整:

<div class="toggle_this">123
    <p style="display:none">
        <a href="#">1</a>
        <a href="#">2</a>
        <a href="#">3</a>
    </p>
</div>
<div class="toggle_this">ABC
    <p style="display:none">
        <a href="#">a</a>
        <a href="#">b</a>
        <a href="#">c</a>
    </p>
</div>

Javascript:

$(document).ready(function(){

    $(".toggle_this").click(function(){
        console.log('divs been hit');
    $(this).children().toggle();
  });

});

リンクの作業コードを参照してください: http://jsfiddle.net/UaCLn/5/

于 2014-04-21T10:02:35.840 に答える