jqueryを使用してイメージソースを動的に変更する

Question

私はチャットアプリケーションを設計しています。私はチャップディスプレイの画像をクリックすると、チャットの相手の連絡先情報と対応する画像がサイドパネルに表示されるという機能を使用しています。ですから、私は、クリック時にサイドパネルの画像のsrcに表示画像のsrcを動的に割り当てることが必要です。 ここに私のコードスニペットがあります。

$(".chat-top").click(function(){ 
     var ig= document.getElementById("contacti"); 
     var ig2=document.getElementById("imgr"); 
     ig2.src=ig.src; 
    }); 

chat-topは、サイドパネルのクリックによるdivです。 contactiは表示画像タグのID、imgrはサイドパネル画像タグのIDです。

何か提案がありますか？

Answer 1

あなたは次のようにjQueryのattr()機能を使って、画像のsrc属性を変更することができます。

$(".chat-top").click(function() { 
 
    console.log("before:", $("#contacti").attr("src"), $("#imgr").attr("src")); 
 

 
    var igSrc= $("#contacti").attr("src"); 
 
    $("#imgr").attr("src", igSrc); 
 
     
 
    console.log("after:", $("#contacti").attr("src"), $("#imgr").attr("src")) 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button class="chat-top"> change </button> 
 
<img id="contacti" src="example"/> 
 
<img id="imgr" src="secondExample"/>