如何通過使用javascript單擊按鈕來在另一個DIV中顯示所選圖像？

Question

這是代碼。實際上，圖像是在中繼器控制中從數據庫動態填充的。 我要的是單擊selecte模板時，所選圖像應替換第一個<td>的empty.jpg。

<tr>
    <td style="text-align: center">
        <asp:Image src="../../Images/empty.jpg" style="height: 400px" ID="imgSide" ClientIDMode="Static" runat="server"/></td>
    <td>
        <div class="row-fluid">
            <ul class="thumbnails" style="list-style: none">
                <asp:Repeater ID="rptTemplates" runat="server">
                    <ItemTemplate>
                        <li class="span4">
                            <article class="thumbnail">

                                <asp:Image runat="server" ImageUrl='<%#string.Format("{0}/{1}",ConfigurationManager.AppSettings["GetTemplates"],Eval("TemplateName")) %>' />
                                <div>
                                    <asp:Button runat="server" ID="btnSelectTemplate" Text="Select Template" Style="text-align: center" ClientIDMode="Static" OnClientClick="ChangeImage('<%#string.Format("{0}/{1}",ConfigurationManager.AppSettings["GetTemplates"],Eval("TemplateName")) %>')"/>
                                </div>

                            </article>

                        </li>

                    </ItemTemplate>
                </asp:Repeater>
            </ul>
        </div>
    </td>
</tr>

Answer 1

嘗試這個

$('table').on('click','.thumbnail button',function(){
 var i_url=$(this).closest('.thumbnail').find('img').attr('src');
 $(this).parents('tr').find('td:eq(0) img').attr('src',i_url);
});

演示