0

jqueryでifステートメントを正しく書く方法を知りたいです。たくさんのdivがあり、それぞれにアンカーがあり、クリックすると、toggleClassを使用してdivの幅が拡張されます。これは正常に機能しますが、他のdivに同じクラスが適用されているかどうかを確認するifステートメントを記述します。その場合、そのdivを縮小し、次のdivを展開します(これが理にかなっていることを願っています)。これまでのコードは次のとおりです。

HTML:

<div class="content-block">
    <h2>Title</h2>
    <p>Content...</p>
    <a class="expand" href="#">Expand View</a>
</div>
<div class="content-block">
    <h2>Title</h2>
    <p>Content...</p>
    <a class="expand" href="#">Expand View</a>
</div>
<div class="content-block">
    <h2>Title</h2>
    <p>Content...</p>
    <a class="expand" href="#">Expand View</a>
</div>
<div class="content-block">
    <h2>Title</h2>
    <p>Content...</p>
    <a class="expand" href="#">Expand View</a>
</div>

JQUERY:

$(document).ready(function(){
$('a.expand').click(function(){
    $(this).parent('.content-block').toggleClass('wide');
});

});

4

3 に答える 3

3

あなたはこのようにそれをすることができます、この場合ifの必要はありません:

$(document).ready(function(){
  $('a.expand').click(function(){        
    $(this).parent('.content-block').toggleClass('wide')
           .siblings('.wide').removeClass('wide');
  });
});

これにより、親のワイドクラスが切り替わり、すべての兄弟からクラスが削除されます。

于 2010-03-29T16:43:47.977 に答える
1

ifステートメントは必要ありません。クラスが適用されてremoveClass()いるもので実行するだけです。wide

$(document).ready(function(){
    $('a.expand').click(function(){
        $('.content-block.wide').removeClass('wide');
        $(this).parent('.content-block').addClass('wide');
    });
});

そして、パフォーマンスのために、代わりにaddClass()とを使用してくださいremoveClass()toggleClass()

于 2010-03-29T16:46:13.483 に答える
0

あなたはこのようなものを書きたいです:

var otherExpanded = $('.content-block.wide');
if (otherExpanded.length)
    //Do things
于 2010-03-29T16:43:14.063 に答える