Jquery 如何通过点击将 img 替换为另一个 img

Question

我有一个问题。

我在 html 页面中有一些代码

$(document).ready(function() {
  $("#img-1").click(function() {
    var imgsrc = $(this).attr('src');
    $(".click-img").attr('src', imgsrc);
  });
});

$(document).ready(function() {
  $("#img-2").click(function() {
    var imgsrc = $(this).attr('src');
    $(".click-img").attr('src', imgsrc);
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<div>
  <tr>
    <td><img src="https://avatarko.ru/img/avatarka/100na100/mults_dobicha_ognya.gif" id="img-1"></td>
    <td><img src="https://avatarko.ru/img/avatarka/100na100/animaciya.gif" id="img-2"></td>
  </tr>
</div>

<div>
  <tr>
    <td><img src="https://avatarko.ru/img/avatarka/100na100/risunki_svecha.gif" class="click-img" id="select-1"></td>
    <td><img src="https://avatarko.ru/img/avatarka/100na100/risunki_svecha.gif" class="click-img" id="select-2"></td>
  </tr>
</div>

以及如何通过替换来更改 img。例如：我单击带有 id="img-1" 的图像，然后单击带有 id="select-1" 的图像。图片 id="img-1" 替换为 id="select-1" ?

我的 Jquery 不工作，我不明白如何解决这个问题。那么您有更好的解决方案吗？

Answer 1

我不知道这是否正是您要找的，但它总能给您一个主意

$(document).ready(function() {
    var srcCopy = '';
  
  $(".defaultImg").click(function() {
    srcCopy = $(this).attr('src');
  });
  
   $(".click-img").click(function() {
      if( srcCopy ){
        $(this).attr('src', srcCopy);
        srcCopy = '';
      }
  });
  
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<div>
  <tr>
    <td><img src="https://avatarko.ru/img/avatarka/100na100/mults_dobicha_ognya.gif" id="img-1"class="defaultImg" ></td>
    <td><img src="https://avatarko.ru/img/avatarka/100na100/animaciya.gif" id="img-2" class="defaultImg" ></td>
  </tr>
</div>

<div>
  <tr>
    <td><img src="https://avatarko.ru/img/avatarka/100na100/risunki_svecha.gif" class="click-img" id="select-1"></td>
    <td><img src="https://avatarko.ru/img/avatarka/100na100/risunki_svecha.gif" class="click-img" id="select-2"></td>
  </tr>
</div>

Jquery 如何通过点击将 img 替换为另一个 img

Jquery how to replace img to another img by click

html

jquery

replace