Question

我对一些JavaScript有一个问题，有一个大图和缩略图，我的JavaScript函数改变了从缩略图中取出它的大图片的链接，它工作正常，但我也有一个高滑，这是有效的对于大图片，当点击大图片时，它的实际尺寸显示为高滑，但我有一点问题，当我更改大图片的链接时，它会自动出现这张图片的两个链接，一个在一个大图片，另一个在缩略图中，所以我需要在点击它之后删除缩略图中的其他链接，所以现在这是我的脚本：

$(document).ready(function() {
    $('.image').click(function(event) {
    event.preventDefault();
    var imagePath = $(this).attr("href");
    var newImg = new Image;
    newImg.onload = function(){
        $('#big_picture2').hide();
        $('#big_picture2').attr('src', imagePath);
        $('.product_image_large').attr('href', imagePath);
        $('#big_picture2').fadeIn('slow');
    };
    newImg.src = imagePath;
    });
});

Answer 1

未经测试，但认为这应该有效：

$(document).ready(function() {
    $('.image').click(function(event) {
    event.preventDefault();
//add big picture link to active thumbnail
$('.image.active').attr('href',$('#big_picture2').attr('src')).removeClass('active');
//set new active thumbnail
$(this).addClass('.active');
    var imagePath = $(this).attr("href");
//remove this href
$(this).removeAttr('href');
    var newImg = new Image;
    newImg.onload = function(){
        $('#big_picture2').hide();
        $('#big_picture2').attr('src', imagePath);
        $('.product_image_large').attr('href', imagePath);
        $('#big_picture2').fadeIn('slow');
    };
    newImg.src = imagePath;
    });
});

删除重复的链接

1 个答案: