图像交换jquery鼠标悬停

我目前在jquery中使用mouseover和mouseout函数时遇到一些问题。我有两张图片叫做‘images/doomsday.jpg’，另一张叫做‘keep_calm.png’，我想在鼠标放在上面时交换，不放在上面时再交换回来。我已经包括了我目前试图使用的代码，有人能看到它有什么问题吗？我哪里出了问题

$(function() {
$("images/doomsday.jpg")
    .mouseover(function() { 
        var src = $(this).attr("src").match(/[^\.]+/) + "images/keep_calm.png";
        $(this).attr("src", src);
    })
    .mouseout(function() {
        var src = $(this).attr("src").replace("images/keep_calm.png");
        $(this).attr("src", src);
    });

---

}))

显然，选择器是错误的：

---

例如，您应该使用

$（“#imageid”）

，其中image id是您要更改的图像的id。

您的选择器错误。您可以了解选择器

下面是一个图像交换的示例

代码：

$('document').ready(function() {

  $('img').on({
    'mouseover' : function() {
      $(this).attr('src','http://media02.hongkiat.com/css3-code-slim/css3-markup.jpg');
    },
    mouseout : function() {
  $(this).attr('src','http://www.w3.org/html/logo/downloads/HTML5_Logo_512.png');
    }
  });
});

---

也许像这样的演示：只需使用Jquery

HTML

JS:

---

没有使用选择器。下面是最终代码的外观

HTML

<div> <img src="images/doomsday.jpg" id='myimage' /> </div>

 .holder { 
     background-image:url('images/keep_calm.png');         
  }


.swapHolder { 
   background-image:url('images/doomsday.png'); 
 }

$('.holder').on('hover', function () {  
   $('.holder').toggleClass('swapHolder'); 
});

<div> <img src="images/doomsday.jpg" id='myimage' /> </div>

$('document').ready(function() {
$(function() {
$("#myimage")
    .mouseover(function() { 
        var src = $(this).attr("src").match(/[^\.]+/) + "images/keep_calm.png";
        $(this).attr("src", src);
    })
    .mouseout(function() {
        var src = $(this).attr("src").replace("images/keep_calm.png");
        $(this).attr("src", src);
    });
});
});