簡単な「サムネイルをクリックしてメイン画像を変更する」コード

Question

クリックしたサムネイル画像に応じてメイン画像を変更しようとしています。 私は、クリックしたサムネイルのタグから新しい画像を取得したいと考えています。

私はattr、srcを使用した他の方法を見てきましたが、いずれの場合も手動で新しい "src"を指定していましたが、クリックしたサムネイルのタグからsrcを取得するコードはどうでしたか？

本当にありがとうと思います。

はEDIT：

は、サムネイルをクリックすると新しいキャプションを取得し、メインの写真のキャプションを変更しようとしています/私の簡略化されたコードは、私は基本的に変更しようとしているこの

  <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> 

のように見えますクリックしたサムネイルのthumb_captionを表示するには 'main_caption' thumb_captionをタイトルまたはaltとして保存すると役立つでしょうか？

おかげで再び

EDITED AGAIN（！）

私はジェームスの提案を使用して、私は一種の次

$（ "＃のmain_caption"）とそれを考え出したと思う。テキスト（$（this）.attr（ "alt"））;

Answer 1

このような何かが、トリックを行う必要があります。

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

それは単にクリック.thumbnail要素のsrcを取得し、#mainImageのsrc値として使用します。