jquery在鼠标翻转时更改图像

我在这方面一直有问题。我认为这应该很简单，但我似乎无法让它工作。我希望在翻开我的facebook按钮时出现一个新图像。谢谢你的帮助

    <p align="right">
          <a href="http://www.facebook.com/AerialistPress" ><img height="30px" id="facebook" class="changePad" alt="Aerialist Press Facebook Page" src="/sites/aerialist.localhost/files/images/facebook300.jpg" /></a> 
           <a href="http://twitter.com/#!/AerialistPress" > <img height="30px" class="changePad" alt="Aerialist Press Twitter Page" src="/sites/aerialist.localhost/files/images/twitter300.jpg" /></a>
           <a href="http://www.pinterest.com/aerialistpress" ><img height="30px" class="changePad" alt="Aerialist Press Pinterest Page" src="/sites/aerialist.localhost/files/images/pinterest300.jpg" /></a>
</p>

<script>
jQuery(document).ready(function(){
     jQuery('#facebook').mouseover(function() { jQuery('#facebook').attr('src').replace('/sites/aerialist.localhost/files/images/facebook-roll.jpg'); })

});
</script>

jQuery（文档）.ready（函数（）{
jQuery（'#facebook'）.mouseover（function（）{jQuery（'#facebook'）.attr（'src'）.replace（'/sites/aerialist.localhost/files/images/facebook roll.jpg'）；）
});

不要使用

replace

，只需直接设置

src

attr：

jQuery('#facebook').attr('src', '/sites/aerialist.localhost/files/images/facebook-roll.jpg');

改变

到

---

您也可以使用

$（'#facebook'）

而不是

$（'#facebook'）

方法

attr

返回指定属性的值（在本例中为'src'），

replace

尝试修改字符串并返回新实例。但是，您没有对新实例执行任何操作

要设置属性，必须向

attr

方法传递一个附加参数

以下是

attr

方法的文档：

您的代码应该是：

jQuery('#facebook').attr('src', '/sites/aerialist.localhost/files/images/facebook-roll.jpg');

给你

$("#img").hover(function(){
//mouseover
     $(this).attr('src', 'https://twimg0-a.akamaihd.net/profile_images/1768071248/smile_normal.jpg'); 
    },
    function(){
//mouseout
    $(this).attr('src', 'http://www.bestfreeicons.com/smimages/Emotes-face-smile-icon.png');
});​

这很有效

<script type ="text/javascript">

 $(document).ready(function(){
 $('#facebook').mouseenter(function() { 
     $('#facebook').attr("src","heretheotherimage.png"); 
 })

 $('#facebook').mouseleave(function() { 
     $('#facebook').attr("src","heretheimage.png"); 
 })

 });
 </script>

 <img src ="heretheimage.png" id ="facebook" />   

$（文档）.ready（函数（）{
$（'#facebook'）.mouseenter（函数（）{
$（'#facebook'）.attr（“src”，“heretheotherimage.png”）；
})
$（'#facebook'）.mouseleave（函数（）{
$（'#facebook'）.attr（“src”，“heretheimage.png”）；
})
});

谢谢！它会改变，但当我将鼠标移出时，它保持不变。有没有办法让它在鼠标离开时重新换回来？谢谢！它会改变，但当我将鼠标移出时，它保持不变。有没有一种方法可以让它在鼠标离开时重新变回？

$("#img").hover(function(){
//mouseover
     $(this).attr('src', 'https://twimg0-a.akamaihd.net/profile_images/1768071248/smile_normal.jpg'); 
    },
    function(){
//mouseout
    $(this).attr('src', 'http://www.bestfreeicons.com/smimages/Emotes-face-smile-icon.png');
});​

<script type ="text/javascript">

 $(document).ready(function(){
 $('#facebook').mouseenter(function() { 
     $('#facebook').attr("src","heretheotherimage.png"); 
 })

 $('#facebook').mouseleave(function() { 
     $('#facebook').attr("src","heretheimage.png"); 
 })

 });
 </script>

 <img src ="heretheimage.png" id ="facebook" />