更改img src attr問題

Question

在當前的迭代中，我得到的結果是，如果用戶單擊圖像縮略圖，則縮略圖圖像將顯示在不同的div（主div）中，並以此將縮略圖img attr減為主div img src attr。 “-縮略圖”。 這部分是好的，或者至少我相信是這樣。

話雖如此，當用戶單擊縮略圖並顯示主要的div img后，它會持續存在……而我的意思是，例如，如果用戶關閉div並重新打開它或另一個div，最后一張圖片顯示（停留）何時不應該在主div中顯示。 相反，它應該在主分區中顯示第一個縮略圖img。

任何建議，贊賞和下面是我目前（或至少一部分）。 還有很多，但以下是給我帶來麻煩的主要內容...

HTML部分位於名為“ t_1”的div類中。 我分別有24個...“ t_1”，“ t_2”和“ t_3”。 在這個類中，我使用相同的div類在所有內容中發布了以下內容。 唯一的區別是img標簽中的文件夾名稱。

因此，當用戶單擊該縮略圖並且該縮略圖被重寫以使其可以顯示在主div“ t_main_screenshot”中時，一切都很好...但是，如果用戶單擊了“ t_1”之外，等等。 div，並打開另一個“ t_2”，先前單擊的最后一個圖像縮略圖顯示在主div（t_main_screenshot）中，而不是“ t_2”中應顯示的第一個圖像縮略圖...

希望這在清晰度方面會更好一點……有點難以解釋。

HTML：

<div class="t_main_screenshot">
    <img src="_framework/images/slides/simplicity/2.png" alt="" title="" />
</div>

<div class="t_thumbnail_wrapper">
    <div class="t_thumbnail active">
        <img src="_framework/images/slides/simplicity/2-thumbnail.png" alt="" title="" />
    </div>
    <div class="t_thumbnail">
        <img src="_framework/images/slides/simplicity/4-thumbnail.png" alt="" title="" />
    </div>
    <div class="t_thumbnail">
        <img src="_framework/images/slides/simplicity/6-thumbnail.png" alt="" title="" />
    </div>
</div>

JS / JQuery：

$('.t_thumbnail').click(function() {
    $('.t_thumbnail').removeClass('active');
    $(this).addClass('active');

    var thumbNail = $(this).find('img').attr('src');

    $('.t_main_screenshot img').fadeOut(0, function() {
        $(this).fadeIn().css('animation','scale-in .75s ease-in 0s forwards')[0].src = thumbNail.replace('-thumbnail', '');
    });
});

Answer 1

試試這個代碼：

 $('.t_thumbnail').click(function() { $('.t_thumbnail').removeClass('active'); $(this).addClass('active'); var thumbNail = $(this).find('img').attr('src'); $(this).parent().parent().siblings().find('.t_main_screenshot').children('img').fadeOut(0, function() { $(this).fadeIn().css('animation','scale-in .75s ease-in 0s forwards')[0].src = thumbNail.replace('-thumbnail', ''); }); }); 

在直接更新.t_main_screenshot類時。 因此它將更新所有位置，在這種情況下，將更新您所有的模態.t_1，.t_2等。

Answer 2

$('a.screenshots_1').click(function() {
    $('.t_main_screenshot img').find('img').attr('src' , "");
});

這將幫助您在模式屏幕截圖圖標單擊時初始化主屏幕截圖。