javascript - jquery图像替换？

Question

当单击“更多”按钮时，“更多”按钮和“精选”的图片将会更改，当您再次单击“更多”按钮时，图像应该与第一个按钮相同，但事实并非如此。

$(document).ready(function(){

    $('#buy_now').hide(); 
    $('#more').click(function() {
        $("#more-btn").attr("src", "http://kilrush.mobi/kil/GetAssetFile?fileId=77470");
        $("#featur-btn").attr("src", "http://kilrush.mobi/kil/GetAssetFile?fileId=77472");
        $('#buy_now').toggle();              
    });      
});

Answer 1

您需要存储原始源然后恢复它。最好的方法是使用 .toggle() 作为按钮，使用 .data 来存储原始源:

$(document).ready(function(){
    var btnMore = $("#more-btn");
    var btnFeature = $("#featur-btn");
    btnMore.data("org_src", btnMore.attr("src"));
    btnFeature.data("org_src", btnFeature.attr("src"));
    $('#buy_now').hide();
    $('#more').toggle(function() {
        btnMore.attr("src", "http://kilrush.mobi/kil/GetAssetFile?fileId=77470");
        btnFeature.attr("src", "http://kilrush.mobi/kil/GetAssetFile?fileId=77472");
        $('#buy_now').show();
    }, function() {
        btnMore.attr("src", btnMore.data("org_src"));
        btnFeature.attr("src", btnFeature.data("org_src"));
        $('#buy_now').hide();
    });
});

Live test case 。 (和可爱的猫:))