Question

以下用于在鼠标悬停/鼠标移动时更改图像源的功能在Chrome中可用：

 $(document).ready(function() {
            $('#img_home').mouseover(function() {
                img_home.src = 'img/btn/act/home2.gif';
            })
            .mouseout(function() {
                img_home.src = 'img/btn/pas/home.gif';
            });

在Firefox中，控制台显示“img_home”未定义。

这是标记：

<a href="Default.aspx">
    <img alt="home" src="img/btn/pas/home.gif" 
     id="img_home" style="border: none" />
</a>

有什么想法吗？

Answer 1

您需要使用this，它将引用相关元素：

 $(document).ready(function() {
    $('#img_home').mouseenter(function() {
       this.src = 'img/btn/act/home2.gif';
    })
    .mouseleave(function() {
       this.src = 'img/btn/pas/home.gif';
 });

Answer 2

您需要使用this来引用该元素，而不是其ID：

$(document).ready(function() {
    $('#img_home').mouseover(function() {
        this.src = 'img/btn/act/home2.gif';
    }).mouseout(function() {
       this.src = 'img/btn/pas/home.gif';
    });
});

Answer 3

你不想要：

$('#img_home').src = ...

除非您在添加的代码段之前定义了img_home变量，否则没有名称为img_home的已知变量。

Firefox中的图像ID未定义

3 个答案: