2

jqueryが苦手です。opacity1の div の子要素の class 属性を取得したい。サンプルコードは以下の通り

<div class='parent'>
   <img class='child1' style='opacity:0;' />
   <img class='child2' style='opacity:0;' />
   <img class='child3' style='opacity:1;' />
   <img class='child4' style='opacity:0;' />
   <img class='child5' style='opacity:0;' />
   <img class='child6' style='opacity:0;' />
   <img class='child7' style='opacity:0;' />
</div>

私が試したこと:

1. $('.parent').find('img').css('opacity','1').attr('class');

しかし、うまくいきませんでした。

2. $('.parent>img{opacity:1}').attr('class');

これも機能しませんでした。

それを成し遂げる方法を教えてください。

4

5 に答える 5

4
$('.parent img').filter(function() {
    return $(this).css('opacity') == 1;
}).attr('class');

あなたが言うように、これは不透明度1の要素が1つしかないことを前提としています。複数ある場合、これは最初に一致した要素のみのクラスを返します。

于 2012-08-06T10:05:12.133 に答える
1

次の構文を使用する必要があります。

$('.parent').find("img^[style='opacity:1;']").attr('class')

デモを見る

于 2012-08-06T10:08:48.080 に答える
1

ここであなたが探しているもののフィドル.filter()... jQueryで使用する必要があります


編集:

Utkanosは、私の前に、私と同じことをしました。

$('.parent img').filter(function() {
    return $(this).css('opacity') == 1;
}).attr('class');
于 2012-08-06T10:09:35.647 に答える
1

次のようなことができます:

var child = null;

$('.parent img').each(function() {
   if(parseInt($(this).css('opacity')) == 1) {
      child = $(this);
      return false;
   }
});
于 2012-08-06T10:03:15.973 に答える
0

クラス属性にデータを格納してインライン スタイルを使用する代わりに、クラスでスタイルを設定し、カスタム属性にデータを格納します。

CSS - 親の子は通常は見えませんが、visibleクラスがある場合は不透明になります

div.parent > img {
    opacity:0;
}

div.parent > img.visible {
    opacity:1;
}

HTML

<div class='parent'>
    <img data-field='child1' />
    <img data-field='child2' />
    <img data-field='child3' class="visible" />
    <!-- and so on -->
</div>

JavaScript:

$('.parent > img.visible').attr('data-field');
//or
$('.parent > img.visible').data('field');
于 2012-08-06T11:31:52.467 に答える