jQuery - 如何替換點擊元素上的IMG SRC？

Question

HTML：

<div id="panel"> 
    <a href="path_to_image1.jpg" rel="shadowbox[page]"> 
    <img src="scripts/timthumb.php?src=path_to_image1.jpg&w=200&h=20" alt="Image name1" /></a> 
</div> 

<div id="thumbs"> 
    <a href="path_to_image1.jpg" rel="shadowbox[page]"><img src="scripts/timthumb.php?src=path_to_image1.jpg&w=30&h=30" alt="Image name1" /></a> 
    <a href="path_to_image2.jpg" rel="shadowbox[page]"><img src="scripts/timthumb.php?src=path_to_image2.jpg&w=30&h=30" alt="Image name2" /></a> 
    <a href="path_to_image3.jpg" rel="shadowbox[page]"><img src="scripts/timthumb.php?src=path_to_image3.jpg&w=30&h=30" alt="Image name3" /></a> 
</div> 

JS：

$('#thumbs a').click(function(evt) { 
    evt.preventDefault(); 
    var clickedElement = $(this).clone(); 
    $('#panel').empty().append(clickedElement); 
}); 

所以這個作品，我想只是改變W =上點擊錨爲w = 200 30 & H = 30個圖像的src & h = 200然後被附加到＃面板。

Answer 1

$('#thumbs a').click(function(evt) { 
    var clickedElement = $(this).clone().find('img').attr('src', function(i, src){ 
     return src.replace('w=30&h=30', 'w=200&h=200') 
    }).end() 
    $('#panel').html(clickedElement); 
}); 

FIDDLE

Answer 2

$('#thumbs a').click(function(evt) { 
    evt.preventDefault(); 
    var clickedElement = $(this).clone(); 
    var img = clickedElement.find('img'), 
     imgSrc = img.attr('src').replace(/w=30&h=30/, 'w=200&h=200'); 

    img.attr('src', imgSrc); 
    $('#panel').empty().append(clickedElement); 
});