創建一個簡單的「單擊縮略圖，更改主圖像」代碼

我試圖讓主圖像根據點擊的縮略圖圖像進行更改。我想讓主圖像從被點擊的縮略圖的標籤中獲取新的src。創建一個簡單的「單擊縮略圖，更改主圖像」代碼

我見過其他使用attr，src的方法，但是在每種情況下，他們都手動指定了新的「src」，我怎麼能從代碼中點擊縮略圖的標記來獲取src？

如果有人可以給我看，非常感謝，謝謝。

編輯：

試圖改變主照片的標題，獲得新標題從縮略圖點擊/我的簡化代碼如下所示

  <img src="{hotel_main_photo}" id="main_photo" class="view_page_photo frame"  width="420" height="320" alt="{title}" /> 

     <p>{main_caption}</p> 

     <div id="thumbnails"> 

      <img src="{thumb}" width ="" height="" alt="" /> 

          <p>{thumb_caption}</p> 

      {/hotel_other_photos} 

     </div>

基本上，我試圖改變'main_caption'顯示被點擊的縮略圖的thumb_caption。我可以將thumb_caption作爲標題存儲，或者如果這可以幫助我們？

再次感謝

EDITED AGAIN（！）

我認爲使用詹姆斯的建議，我有點理解了它具有以下

$（「＃main_caption」）。文本（$（本）.attr（「ALT」））;

來源

2011-10-20 onjegolders

如果你可以把你的代碼或HTML的問題，它會更容易回答。 – Birey

像這樣的東西應該做的伎倆：

$(".thumbnail").click(function() { 
    $("#mainImage").attr("src", $(this).attr("src")); 
});

它只是獲取點擊.thumbnail元素的src，並使用它作爲#mainImage的src值。

來源

2011-10-20 18:40:22

哇，真是太棒了，謝謝！我擔心我不得不使用數組而不理解它們......一件小事，我添加了圖片周圍的標籤返回false。非常感謝詹姆斯！ – onjegolders

你會不會碰巧知道如何改變相關的文字呢？例如，在每個縮略圖之後都有一個帶有標題的「p」標籤。在更改src的同時，是否有任何方法更改標題，以便拇指標題變爲主圖像的標題？ – onjegolders

好吧，如果不知道你的HTML結構很難說，但你應該可以簡單地做'$（「＃whatever」）。text（「whatever」）;''。如果您需要更多幫助，我建議發佈一個新問題。 –

創建一個簡單的「單擊縮略圖，更改主圖像」代碼

回答

相關問題