jQuery ajax切換回到點擊img src

Question

我有一個放大的圖像從拇指到大由ajax使用點擊。

他們是否使用相同的HTML元素只需更換IMG SRC 例如：

src="image_thumb.jpg" 

開關

src="image_large.jpg" 

我的問題是，如何當用戶切換回拇指圖像再次點擊。

Answer 1

由於toggle在1.8被棄用，除去1.9，你應該這樣做

$('img').on('click', function(){ 
    var $this = $(this); 
    if ($this.data('originalSrc')){ 
    $this.prop('src', $this.data('originalSrc')); 
    $.removeData(this, 'originalSrc'); 
    } else { 
    $this.data('originalSrc', $this.attr('src')); 
    $this.prop('src', 'image_large.jpg'); 
    } 
}); 

DEMO http://jsfiddle.net/PSFeJ/

Answer 2

您可以使用toggle-event API使用兩種功能：一種從拇指變爲大，另一種從大變爲拇指。通過使用切換，每當用戶點擊時它將在兩者之間交替。

如果你想嘗試的類方法，你可以這樣做：

$('img').on('click', function(){ 
    if ($(this).hasClass('thumb')){ 
    $(this).removeClass('thumb').addClass('large'); 
    //set your large image here 
    } else { 
    $(this).removeClass('large').addClass('thumb'); 
    //set your thumb image here 
    } 
}); 

的獎金這裏是你可以使用CSS進行任何更改，以適應大的圖像或縮略圖。