1

div の行があり、すべて同じクラスを持っています。ユーザーのコメントをページに表示します。

4 未満の場合にコメントの幅を変更する if ステートメントを作成しました。

同じクラス名を共有している場合でも、その 1 行の div のみをターゲットにできる方法はありますか

JS

// if statements to sort out widths if there are < 4 comments
if(commentLength === 1){
    $('.comment').css('min-width','1453px');
}
else if(commentLength === 2){
    $('.comment').css('min-width','700px');
}
else if(commentLength === 3){
    $('.comment').css('min-width','470px');
}

HTML

<div class="commentary">
    <div class="comment">Sample commnent</div>
    <div class="comment">Sample commnent</div>
    <div class="comment">Sample commnent</div>
    <div class="comment">Sample commnent</div>
</div>
<div class="commentary">
    <div class="comment">Sample commnent</div>
    <div class="comment">Sample commnent</div>
</div>
<div class="commentary">
    <div class="comment">Sample commnent</div>
</div>
4

2 に答える 2

2 
$(".commentary").each(function () {
   var $comments = $(this).find('.comment');
   var commentLength = $comments.length;

   //your JS code goes here, but replace $('.comment') with $comments
});

フィドル: http://jsfiddle.net/jG6FB/

于 2013-01-17T03:32:51.623 に答える
0 
$('.commentary').each(function(){
    var $myComments = $(this).find('.comment');
    var commentLength = $myComments.length;

    if(commentLength === 1){
        $myComments.css('min-width','1453px');
    }
    else if(commentLength === 2){
        $myComments.css('min-width','700px');
    }
    else if(commentLength === 3){
        $myComments.css('min-width','470px');
    }        
});
于 2013-01-17T03:32:55.887 に答える