2

これはもともと機能していましたが、W3C バリデーターを実行してエラーを修正したところ、機能しなくなりました。

私はjsfiddleをセットアップしました

基本的には、ネストされた ul の束がドロップダウンとして使用され、個々にクリックすると、ネストされた ul に含まれる情報が表示される見出しが選択されます。

しかし、li の内部に ul を適切にネストすると、これは機能しません。children/siblings/next などのセレクターを試してみましたが、すべて役に立ちませんでした。それらが機能しないと言っているわけではありませんが、機能するほど十分に理解していないだけです(明らかに!)。

このコードは、すべてのリストを一度にスライドさせますが、個別に制御したいです。

$(function(){
  $("ul.featureListings").hide();

  $(".featuresHeading").click(function() {
    $('ul.featureListings').slideToggle(300);
    return false;
  });
});

次のようなものを使用していると確信しています:

$(this).next('.featureListings').slideToggle(300);

うまくいくはずですが、私の人生ではそれを適切に理解することはできません。入れ子になっていて、適切にターゲットを絞っていないためだと思いますが、締め切りと同様に知識が限られています。

それに応じて適切なULをターゲットにするにはどうすればよいですか? 誰かが光を当てて、なぜこれが機能しないのかを理解するのを手伝ってくれるかどうか疑問に思っていますか?

4

4 に答える 4

3

これを試して:

$(function(){
  $("ul.featureListings").hide();

  $(".featuresHeading").click(function() {
    $(this).next("li").children('ul.featureListings').slideToggle(300);
    return false;
  });
});

正しい方法でDOMを移動する必要があります。次のli(.next( "li"))に移動し、次にその子の1つ(.children('ul.featureListings'))に移動して、slideToggleをトリガーします。そこの。

于 2013-02-12T15:02:27.040 に答える
1

私が理解したことは何でもjsfiddleを作成しました。おもう。slideToggle現在のオープン時に次と前のクローズが必要です。私はhtmlページにも変更を加えました。

 $("ul.featureListings").hide();

  $(".featuresHeading").click(function() {
      $('ul.featureListings').not($(this).children('ul.featureListings')).slideUp();
    $(this).children('ul.featureListings').slideToggle(300);
    return false;
  });
于 2015-10-05T09:43:28.930 に答える
0

使用する.next()

$(this).next().find('ul.featureListings').slideToggle(300);

デモはこちらhttp://jsfiddle.net/heE6J/4/

于 2013-02-12T15:04:00.200 に答える
0

$(function(){
  $("ul.featureListings").hide();

  $(".featuresHeading").click(function() {
    $('ul.featureListings', $(this).next()).slideToggle(300);
    return false;
  });
});
于 2013-02-12T15:08:48.447 に答える