1

別の要素がクリックされたときに要素が表示されるかどうかに基づいて、2つの異なる関数のセットを実行しようとしています。関数全体は次のとおりです。

$('#grid').click(function() {
  if('#photo_grid:hidden') {
    $('#grid').addClass('active').removeClass('fadein');
    $('.cycle-slideshow').fadeTo('fast',0.3);
    $('#photo_grid').fadeIn('slow');
  } else {
    $('#grid').addClass('fadein').removeClass('active');
    $('#photo_grid').fadeOut('fast');
    $('.cycle-slideshow').fadeTo('slow',1.0);
  }
});

これにより、必要に応じて、最初のクリックでクラスが追加/削除され#grid、.cycle-slideshow30％にフェードされます。 #photo_gridただし、フェードインせず、結果として後続のクリックは失敗します。なぜこれが起こるのか誰かが提案できますか？

ページはここにあり、#gridボタンは右下にあります。

4

1 に答える 1

2

の問題ifは、文字列の存在を効果的にテストしているのに対し、実行しようとしているのは要素の可視性に応答することです。したがって、私は次のいずれかを提案します：

if ($('#photo_grid:hidden').length)

または：

if ($('#photo_grid').is(':hidden'))

この.lengthチェックにより、セレクターによって返される項目が1つ以上あることが確認されます（jQueryは常に配列を返します（空の配列であっても）が、is()メソッドはブール値を返し、要素が一致または不一致であることを反映します。メソッドに渡されたセレクター。

参照：

于 2012-11-23T19:04:43.213 に答える