1

ページ（h1）にたくさんのタイトルがあり、各コンテンツのIDを手動で追加することなく、後続の特定のコンテンツを表示するために、各タイトルの直後に「表示/非表示」機能を追加したいと思います。タイトル。

私はjqueryにかなり慣れていないので、これまでに行ってきました。お気づきのように、問題はすべてのdivが表示/非表示になっていることです。

jQueryコード：

$(document).ready(function(){
  $("h1").append(' [<a class="show-hide">Show/Hide</a>]');
  $(".show-hide").click(function(){
    $("div").slideToggle("normal");
  })
});

そしてHTMLコード：

<h1>Title 1</h1>
<div>Content 1</div>
<h1>Title 2</h1>
<div>Content 2</div>
<h1>Title 3</h1>
<div>Content 3</div>

そしてそれはこのように見えます：

Title 1 [Show/Hide]
Content 1
Title 2 [Show/Hide]
Content 2
Title 3 [Show/Hide]
Content 3
4

1 に答える 1

3

これを試して：

$('h1').click(function (e) {
    $(this).next().toggle();
});

これがフィドルです。

h1タグをクリックして、実際の動作を確認してください;）

于 2012-08-20T18:09:23.010 に答える