无法使用 jquery 选择更改的图像 src

Question

我已经通过 jquery 更改了 img src，但是现在我想在您单击图像时打开一个模式，并且由于某种原因我无法选择更改后的 img，当我单击它时，操作会转到图像在 src 更改之前。 这是我的代码：

HTML：

        <div class="tipoplantas text-center">
            <button id="botao2" type="button" class="botaoplantas">1</button>
            <button id="botao1" type="button" class="botaoplantas">2</button>
        </div>
        <div class="imagemplanta text-center">
            <img id="imagemplanta" src="img/infinity/planta1.jpg" class="img-fluid">
        </div>

JAVASCRIPT：

    // Switch Images

    $('#botao1').click(function(){
      $('#imagemplanta').each(function(){
         $(this).animate({
           opacity: 0
         }, 500, function(){
          $('#botao1').addClass('selected')
          $('#botao2').removeClass('selected')
            $(this).attr('src', '/img/infinity/planta1.jpg');
         });
        $(this).animate({
          opacity: 1
        }, 500);
      });
   });
    $('#botao2').click(function(){
      $('#imagemplanta').each(function(){
         $(this).animate({
           opacity: 0
         }, 500, function(){
            $('#botao2').addClass('selected')
            $('#botao1').removeClass('selected')
            $(this).attr('src', '/img/infinity/planta2.jpg');
         });
        $(this).animate({
          opacity: 1
        }, 500);
      });
   });

   // Test
   $("img[src$='img/infinity/planta2.jpg']").click(function() {
    alert('234');
  })
  $("img[src$='img/infinity/planta1.jpg']").click(function() {
    alert('123');
  }) 

所以每当我切换到第二张图片并点击顶部时，它会发送警报“123”而不是我想要的“234”。

Answer 1

你可以这样做

$('#imagemplanta').click(function()
  {
  let imgSrc = $(this).attr('src')
    , imgIdx = imgSrc.lastIndexOf("/") + 1
    , imgName = imgSrc.substr(imgIdx)
    ;
  if (imgName === 'planta1.jpg')  alert('123')
  else                            alert('234')
  })