0

タイトルがちょっと汚いです、すみません。

今、私がやろうとしていることを説明しましょう。

次のように、リストされたアイテムがいくつかあります。

<li>
    <a id="toggle" class="0"><h4>ämne<small>2010-04-17 kl 12:54</small></h4></a>
    <p id="meddel" class="0">text</p>
</li>

<li class='odd'>
    <a id="toggle" class="1"><h4>test<small>2010-04-17 kl 15:01</small></h4></a>
    <p id="meddel" class="1">test meddelande :) [a]http://youtube.com[/a]</p>
</li>

私が達成しようとしている機能は、ユーザーが「トグル」リンク (h4 テキスト) をクリックしたときに、その下の段落要素をフェードインさせたいということです。トグル リンクと同じクラスの段落を作成し、トグルリンクをクリックしたのと同じクラスの段落を取得して表示しますか? しかし、それを行う方法も完全にはわかりません.tbh、それは最高のアイデアのようには聞こえませんが、おそらくそれが唯一の方法ですか？知らない...

ID「meddel」で最も近い段落（リンクの下）を単純に取得してフェードインする方法はありますか？それは少し簡単に聞こえます...

少しでもヒントになれば幸いです。前もってありがとう、-ナイキ

4

3 に答える 3

2 
$("h4").click(function() {
  var p = $(this).siblings("p");
  if (p.is(":hidden")) {
    p.fadeIn();
  } else {
    p.fadeOut();
  }
});

1 つの問題: アンカーの ID が同じです。彼らはすべきではありません。ID は一意である必要があります。

于 2010-04-18T12:22:29.260 に答える
2

ID は一意である必要があります。次のように、リンクにクラスを指定します。

<li>
    <a class="toggle"><h4>ämne<small>2010-04-17 kl 12:54</small></h4></a>
    <p>text</p>
</li>

<li class='odd'>
    <a class="toggle"><h4>test<small>2010-04-17 kl 15:01</small></h4></a>
    <p>test meddelande :) [a]http://youtube.com[/a]</p>
</li>

次に、これを行うことができます：

$(function() {
  $("a.toggle").click(function() {
    $(this).next("p").animate({ opacity: 'toggle'});
  });
});

これをクリック<a class="toggle">すると、次が見つかり、<p>フェードトグルします。また、クラスは数字で始めることはできません。予測可能な結果を​​得るために、これを行わないようにしてください。

于 2010-04-18T12:22:06.100 に答える
0

これを試して：

$(function(){
    $('a.toggle, a.toggle h4').toggle(function(){
      $(this).next().fadeOut('slow');
    }, function(){
      $(this).next().fadeIn('slow');
    });
});

リンクに のclass代わりに を付けidます。

于 2010-04-18T12:22:21.663 に答える