jquery - 为什么我的 jQuery 选择器不工作？

Question

我正在编写一个替换两个图像的简单脚本。第一个可以正常交换，但第二个由于某种原因不会触发。我想念的东西一定很简单。也许是“div.singleTint img”选择器？有人可以看一下并仔细检查我的工作吗？

这是我的 HTML：

    <div id="beerGlassOverlay">
    <img src="<?php bloginfo('template_directory'); ?>/images/beerOverlay.png" class="glassreplace">
</div>

<li class="image-rollover">
    <a href="http://brasco.co/Mims/meet-the-breweries/miller-beers/" target="_blank">
        <img width="177" height="186" src="http://brasco.co/Mims/wp-content/uploads/2012/05/miller1.png" class="attachment-full wp-post-image" alt="miller" title="miller" />
    </a>
    <div class="singleTint">
        <img width="279" height="524" src="http://brasco.co/Mims/wp-content/uploads/shrekBeer.png" class="attachment-full" alt="shrekBeer" title="shrekBeer" />  
    </div><!-- End singleTint-->
</li> 

这是我的 jQuery：

$('li.image-rollover').mouseover(function() {   
$('img.glassreplace').attr({//Change the src and size info on hover         
    src: ('div.singleTint img', this).src,
    width: '100%',
    height: '100%'
    });
});`

Answer 1

change this:

src: ('div.singleTint img', this).src,

to:

src: $('div.singleTint img', this).attr('src'),

Answer 2

src: ('div.singleTint img', this).src, should become src: $('div.singleTint > img', this).attr("src"),

(I've added child selector - >)

Answer 3

您是否缺少代码第三行（$）上的 jQuery 对象引用？

 $('li.image-rollover').mouseover(function() {   
 $('img.glassreplace').attr({//Change the src and size info on hover         
    src: $('div.singleTint img', this).src, //Added the jQuery object in front of the parenthesis.
    width: '100%',
    height: '100%'
    });
 });