jQuery更改img src基於href

Question

我有四個或五個縮略圖旁邊的全尺寸圖像。當我點擊縮略圖時，我只想要它替換全尺寸的圖像。

縮略圖：

<a href="newimage.jpg" class="enlarge"><img src="thumbnail.jpg" alt="thumbnail" /></a> 

原圖：

<div id="folio-detail"> 
<img id="fullImage" src="image.jpg" /> 
</div> 

的jQuery：

$(function(){ 
     $("a.enlarge").live('click', function (e) { 
      e.preventDefault(); 
      $("img#fullImage").attr("src", $(this).attr("href")); 
     }); 
    }); 

這是不工作...任何幫助嗎？

Answer 1

需要在代碼之前引用jQuery，以便定義jQuery（$）函數。我稍微改變你的代碼太（這是工作），但希望改變使得它更清晰

<script type="text/javascript" src="jquery.js" ></script> 
<script type="text/javascript"> 
$(function() { 
    $("a.enlarge").live('click', function (e) { 
     e.preventDefault(); 
     var href = this.href; 
     $("#fullImage").attr("src", href); 
    }); 
}); 
</script> 

An example

Answer 2

它看起來是正確的。你有沒有試過提醒發生了什麼？即在e.preventDefault之上放置「alert（'here'）」。還提醒點擊href。如果兩者都正確，請嘗試將全圖像選擇器更改爲'＃folio-detail img'。

你還可以看看不斷變化的源代碼（即Firebug/Developer工具），看看是否有什麼變化嗎？

Answer 3

您的代碼確實有效。我已經把它放入JSFiddle，它的工作原理，只是看看here on JSFiddle。

你確定包含了JQuery庫嗎？