Question

代码是这样的：

$(' html body div.wrapper div.middle div.post_home:first-child a ').hover(
function() {
        $(' html body div.wrapper div.middle div.post_home:first-child a > img ').attr("src", "http:/site/test1.png");
},
 function() {
        $('html body div.wrapper div.middle div.post_home:first-child a > img ').attr("src", "currentSrc");
});

我只需要在更改之前保留图像的src值，以便在mouseleave上我可以检索图像并显示它。

Answer 1

在活动开始前备份您的src attrivute，然后再进行更改。当你想要回去时使用它。

var currentSrc;
$('.post_home:first-child a ').hover(function() {

    currentSrc = $('.post_home:first-child a > img').attr("src");
    $('.post_home:first-child a > img ').attr("src", "http:/site/test1.png");

}, function() {

        $('.post_home:first-child a > img').attr("src", currentSrc);

});

注意：我编辑了您的选择器，因为您拥有的不仅仅是必需的。

Answer 2

您可以使用data属性存储src以便稍后检索：

var thisImg;
$('.post_home:first-child a').hover(function () {
    thisImg = $('img', this)[0];
    $(this).data('img-src', thisImg.src);
    thisImg.src = "http:/site/test1.png";
}, function () {
    thisImg.src = $(this).data('img-src');
});

<强> Demo

Answer 3

您可以将原始src缓存在变量中以便稍后使用。像这样：

var originalSrc = $(' html body div.wrapper div.middle div.post_home:first-child a > img ').attr('src');
$(' html body div.wrapper div.middle div.post_home:first-child a ').hover(
function() {
        $(' html body div.wrapper div.middle div.post_home:first-child a > img ').attr("src", "http:/site/test1.png");
},
 function() {
        $('html body div.wrapper div.middle div.post_home:first-child a > img ').attr("src", originalSrc);
});

Answer 4

尝试使用HTML5 data attributes，这样您就可以将原始网址存储在“src”道具中以及要更改的data-src="my other image"图片中。

<img src="my original image" data-src="my other src" />

保持当前的src attr所以我可以检索图像

4 个答案: