Jquery gallery empty/append

Question

用预览创建图片库。当我点击一张图片时，它是空的div，但它不会追加新图片。我错过了什么吗？

<div class="thumbnails"> 
    <img onmouseover="preview.src=classone.jpg" id="img1" class='pic' src="classone.jpg" alt="Image Not Loaded"/> 
    <img onmouseover="preview.src=danceshoes.jpg" id="img2" class='pic' src="danceshoes.jpg" alt="Image Not Loaded"/> 
    <img onmouseover="preview.src=lakemonroe.jpg" id="img3" class='pic' src="lakemonroe.jpg" alt="Image Not Loaded"/> 
    <img onmouseover="preview.src=danceshoes.jpg" id="img4" class='pic' src="danceshoes.jpg" alt="Image Not Loaded"/> 
    <img onmouseover="preview.src=danceshoes.jpg" id="img5" class='pic' src="danceshoes.jpg" alt="Image Not Loaded"/> 
    <img onmouseover="preview.src=dance.jpg" id="img6" class='pic' src="dance.jpg" alt="Image Not Loaded"/> 
    </div><br/> 

    <div class="preview" align="center"> 
    <img id="preview" src="classone.jpg" alt="N Image Loaded"/> 
    </div><br/> 

$(document).ready(function(){ 

    $('.pic').click(function(){ 
      $(".preview").remove(); 

     $(".preview").append(this); 
    }); 


}); 

Answer 1

您需要设置新的src而不是取消预览图像元素：

$('.pic').click(function(){ 
    $("#preview").attr("src",$(this).attr("src")); 
});