0

私はjQueryに関しては完全な初心者なので、助けてくれてありがとう。まず、私がやろうとしていることを説明しましょう。私はワードプレスのテーマを作成しています。デフォルトの動作のように個々の投稿だけでなく、投稿のリストでコメントを表示できるようにしたいと思います。コメントリストがすべての投稿で制御できなくなるのを防ぐために、ボタンをクリックするまでコメントリストを非表示にするためにjQueryを使用したいと思います。投稿の1つからのhtmlの例を次に示します。

<div class="comments_section>
  <p class="comments_link">1 Comment</p>
  <p class="PostAComment_link">1 Comment</p>
  <ul class="Comments">
    <li>Comment1</li>
    <li>Comment1</li>
  </ul>
</div>

次に、次のjQueryがあります。

jQuery(document).ready(function() {
jQuery(".Comments").hide();
//toggle the componenet with class msg_body
jQuery(".comments_link").click(function()
{
  jQuery(".Comments").slideToggle();
});

したがって、クラス.comments_linkのテキストをクリックすると、クラス.CommentsのULが再表示/非表示になります。リンクをクリックすると、そのクラスのすべてのULが切り替わる以外は機能します。特定の.comments_sectiondiv内にある.commentsdivだけをターゲットにするにはどうすればよいですか？

再度、感謝します！

4

1 に答える 1

1

あなたはこれを試すことができます：

jQuery(this).siblings(".Comments").slideToggle();

クリックイベントハンドラー内でクリックされthisた要素jQuery(this).siblings()がある場合、（明らかに）その要素の兄弟を提供し、.siblings()メソッドではオプションで特定のセレクター（この場合は「.Comments」）に一致する兄弟を選択できます。

これは、複数の「comments_section」divがあり、それぞれに1つのコメントリンクとコメントリストしかないことを前提としています。

于 2012-05-16T02:22:42.983 に答える