0

ユーザーが div をクリックしたときに div を非表示にし、非表示の div のコンテンツを下にスライドさせるには、助けが必要です。次のコードは、非表示の div を下にスライドするためのものです。

    $(document).ready(function (){ $('.hide').hide();
    $('.main:has(".hide")').find('div.toggle').click(function() {
       var el = $(this).next('.hide'),
       check = (el.is(':visible')) ? el.slideUp() : ($('.hide').slideUp()) (el.slideDown());
    });

    });

上記の例はここにあり、このリンクには完全なマークアップと、read more div を非表示にしようとしたいくつかの実験がありますが、すべての div が非表示になります。

みんなありがとう、私の質問は解決しました:)

4

4 に答える 4

0

あなたが学ぶ必要があるのは の使い方だと思いますthis。 thisクリックした要素を参照するキーワードです。$(this).hide()したがって、 or remove() や toggle() など、好きなことを行うことができます。

http://jsbin.com/awirap/5/edit

これをJQueryする

編集：別のものをクリックしたときに続きを表示するには、次のようにします。

$('.toggle').show();

それらをすべて表示してから、このコードの後に​​、$(this).hide();クリックしたものだけを非表示にします。

于 2013-02-07T06:32:29.467 に答える
0

より簡単な方法を次に示します。

$(document).ready(function(){
  $('.toggle').click(function(){
    $(this).hide();
    $(this).next('div').slideToggle();
  });
});

省略形の if/else ステートメントは、三項演算子と呼ばれます。コードでは、追加のテキストを含む div が表示されている場合は上にスライドし (非表示)、それ以外の場合は下にスライドします (表示)。ただし、 : の後の部分にはおそらく ($('.hide').slideUp()) を指定しないでください。

于 2013-02-07T06:33:02.733 に答える
0

これが欲しいと思います：http://jsbin.com/awirap/6/edit

$(document).ready(function (){
   $('.hide').hide();
   $('.main').find('div.toggle').click(function() {
       if ($('.hide').css("display") == 'none') {
          $('div.toggle',this).addClass("hidden").next().addClass("show");
       } else {    //---------------------------------^^---missed the parentheses
          $('div.toggle').show();
       }
       var el = $(this).next('.hide'),
       check = (el.is(':visible')) ? el.slideUp() : ($('.hide').slideUp()) (el.slideDown());
   });
});

if someone would help me explain the above if else shorthand statement.

(condition) ? if true : if false
于 2013-02-07T06:42:33.767 に答える