1

これがフィドルです：http： //jsfiddle.net/Xhqz9/

常に子要素である<div id="primary" />anyの内部にある画像を除いて、内部のすべての画像を検索し、それらの画像にホバー効果を加えようとしています。<div class="nohover" />

<div id="primary">
    <img src="http://placehold.it/75x75">
    <div class="nohover">
        <img src="http://placehold.it/75x75">
    </div>
    <img src="http://placehold.it/75x75">
    <div class="nohover">
        <img src="http://placehold.it/75x75">
    </div>
</div>​

jQuery：

var postImgsRed = $('#primary').find('img');
postImgsRed.each(function() {
    $(this).css('border', '1px solid red');
});

var postImgsHover = $("#primary > :not(.nohover)").find("img");
postImgsHover.each(function() {
    $(this).hover(function() {
        $(this).fadeOut(100);
        $(this).fadeIn(500);
    })
});​

ホバー機能が正しく実行されていません。私がやりたいように、1番目または3番目の画像には効果がありません。私は何が間違っているのですか？

4

6 に答える 6

2 
var postImgsRed = $('#primary').find('img');
postImgsRed.each(function() {
    $(this).css('border', '1px solid red');
});

var postImgsHover = $("#primary > img");
postImgsHover.each(function() {
    $(this).hover(function() {
        $(this).fadeOut(100);
        $(this).fadeIn(500);
    })
});​

フィドル: http://jsfiddle.net/Xhqz9/1/

注：これはあなたの例で機能します。の直系の子孫ではない画像が#primary条件に一致する場合は、それを変更する必要があります$("#primary img").not(".nohover img")。

于 2012-12-07T21:54:53.097 に答える
2

.notセレクターを使用して、.nohover の下のものを除外します

$('#primary img').not('.nohover img')

http://jsfiddle.net/HDuRq/

ホバー効果をいじる

于 2012-12-07T21:55:32.097 に答える
0

の直接imgの子孫を見つけることができます#primary：

$('#primary > img').each();
于 2012-12-07T21:51:02.480 に答える
0

セレクターを使用します。

$('#primary > img')
于 2012-12-07T21:51:26.940 に答える
0

子孫ではなく、ノードの直接の子孫のみを選択するため、children()代わりに使用します: http://api.jquery.com/children/find()

$('#primary').children('img');
于 2012-12-07T21:53:09.423 に答える
-1

.not() を使用して、.nohover クラスの要素を除外します。

$('#primary div').not('div.nohover').find('img')...
于 2012-12-07T22:03:02.287 に答える