jquery - jQuery下钻选择器？

我编写了这段代码，可以在您向其添加“ simplehover”类的任何图像上产生滚动悬停效果：

    //rollover effect on links
    $(".simplehover").mouseover(function () {
        $(this).attr("src", $(this).attr("src").replace("-off.", "-on."));
    }).mouseout(function () {
        $(this).attr("src", $(this).attr("src").replace("-on.", "-off."));
    });

<img src="slogan.gif" class="simplehover" />

我想让它工作，如果您将类'simplehover'添加到周围的元素：中。 （对于ASP.net asp：HyperLink标记特别有用，该标记会在超链接内自动生成IMG标记。

<a href="#" class="simplehover"> <img src="slogan.gif" /> </a>

如果我将选择器更改为：$（“。simplehover img”），它将起作用，但是在senario＃1中将不再起作用。

我尝试了这个，但是没有运气：

$(".simplehover").mouseover(function () {
if ($(this).has('img')) { $(this) = $(this).children(); }
...

任何人都可以弄清楚吗？

Montreal Web Design

最佳答案

您可以结合使用hover()方法和multiple selector进行重构。

$("a.simplehover img, img.simplehover").hover(function () {
    $(this).attr("src", $(this).attr("src").replace("-off.", "-on."));
}, function() {
    $(this).attr("src", $(this).attr("src").replace("-on.", "-off."));
});

<img src="slogan.gif" class="simplehover" />