javascript鼠标悬停图片交换问题

Question

我正在尝试用javascript换出悬停图片，但它似乎没有工作，任何想法为什么？我认为这是正确的方法。

<li>
   <a onMouseOver="document.fbi.src=images/facebookIconHover.jpg" onMouseOut="document.fbi.src=images/facebookIcon.jpg"
href="http://www.facebook.com">
     <img src="images/facebookIcon.jpg" NAME="fbi">
  </a>
</li>

Answer 1

看起来您需要做的就是（假设这些图像存在）在src字符串周围加上单引号。

onMouseOver="document.fbi.src='images/facebookIconHover.jpg'"
onMouseOut="document.fbi.src='images/facebookIcon.jpg'"

我建议你使用CSS :hover作为图像，因为它将表示与内容/脚本分开。

#element {
   background-image:url('url1.png');
}
#element:hover {
   background-image:url('url2.png');
}

Answer 2

通过jQuery：

$('img[name="fbi"]').hover(function(){
    $(this).attr('src','images/facebookIconHover.jpg');
},function(){
    $(this).attr('src','images/facebookIcon.jpg');
});