javascript - img src 路径仅在悬停 jquery 时给出第一个子项

Question

我在 html 中创建了一个图像 div，下面是代码

<div class="container">
    <div class="TabMenu">
        <span><img src="images/ecom.png"></span>
        <span><img src="images/cms.png"></span>
        <span><img src="images/crm.png"></span>
        <span><img src="images/creative.png"></span>
        <span><img src="images/development.png"></span>
        <span><img src="images/qa.png"></span>
        <span><img src="images/mobile.png"></span>
    </div>
</div>

现在我写了jquery

$(".container .TabMenu span").mouseover(function() {
    var imgpath = $('img').prop('src');
    alert(imgpath);
})

当鼠标悬停在任何图像上时，它会显示一个警报框，其中包含第一个图像的路径，但不显示相应的路径。我如何检索各自的图像路径

现在我在这里提出一个问题

当我点击特定图像时，它的图像应该改变，下面是我编写的代码

我有两个图像作为 image1.png 和 image1-h.png，通过这种方式我使用悬停样式但是

$(".container .TabMenu span").click(function(){
var newSrc = $('img', this).attr('src').replace(".", "-h.");
$('img', this).attr("src", newSrc);             
});

我有两个图像，即 image1.png 和 image1-h.png，通过这种方式，我通过将图像名称替换为“-h”来使用悬停样式。但是当我单击此图像 ecom 时，它会变成 ecom-h，cms 会变成 cms-h，我怎样才能恢复该图像的原始 src 路径，以便该图像处于事件状态。 当我单击其他图像时，之前单击的图像的路径应到达原始路径

Answer 1

改用这个:

var imgpath = $('img', this).prop('src');

在您的情况下，您正在整个文档中查找 img 标记并首先获取它们。