Question

我有一个导航按钮，我希望每次用户点击它时都会更改图像（从菜单图标到关闭图标），这是我正在使用的代码，但是当我将文本交换到图像时由于某种原因，关闭图标不会“返回”菜单图标。

有任何帮助吗？感谢。

$(function() {
  $('.mobileMenu').on('click', function(e) {
    $('body').toggleClass('menuOpened');
    $(this).html($(this).html() == 'Close' ? 'Menu' : 'Close');
  });
});

<div class="mobileMenuRight">
  <a href="/cart" class="mobileCart"><img src="../cartIcon.png" alt="Cart" height="22"></a>
</div>

Answer 1

希望这就是你要找的东西。

＆＃13;

$('.mobileMenuRight').click( function() {
  if (!$('.mobileMenuRight').hasClass('menuOpened')) {
    $('.mobileMenuRight').addClass('menuOpened');
    $('.mobileCart ' + 'img').attr({
      src: "http://via.placeholder.com/250x250/000000/8888888",
    });
  } else {
    $('.mobileMenuRight').removeClass('menuOpened');
    $('.mobileCart ' + 'img').attr({
      src: "http://via.placeholder.com/250x250/8888888/000000",
    });
  }
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="mobileMenuRight">
  <a href="#" class="mobileCart"><img src="http://via.placeholder.com/250x250/8888888/000000" alt="Cart" height="22"></a>

＆＃13;

在Click上切换图像（jQuery）

1 个答案: