Как я могу обернуть изображение в тег привязки для функциональности «нравится» и «не нравится» - PullRequest
0 голосов
/ 31 марта 2020

Мне нужно обернуть изображение в форме сердца в тег привязки для функции «нравится» и «не нравится». Я сделал, но соответствующее изображение ведет себя как тег привязки. когда я нажимаю на изображение, я перехожу к определенной ссылке, которую я упоминаю. Что я хочу, так это когда я нажимаю на изображение, я просто хочу вызвать функцию для лайков и нелюбов.

for your reference you can check image what i want

<a>
  <div className="hidden">
    <div className="hx-243px bg-cover transitionAll-0p3 slide-item-img no-selectable" style={{backgroundImage: `url(${thumb})`}}> 
      <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgATURjH/98kkVJUXIjYg3griojiRcEN6sEFQuYlnYMeSjxYRRBPntzSg3oSRPBgQ==" style={{float: "right", padding: "5px", display: "inline-block"}}></img>
    </div>
  </div>
</a>

Заранее спасибо

1 Ответ

0 голосов
/ 31 марта 2020

Необходимо добавить прослушиватель событий при щелчке тега привязки и затем предотвратить событие по умолчанию.

Проверить следующие ссылки:

https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener https://developer.mozilla.org/en-US/docs/Web/API/Event/preventDefault

TL; DR

Код будет выглядеть примерно так

<a href="javascript:;" id="like">
  <img src="heart.png"/ alt="like">
</a>

<script>
  var likeButton = document.getElementById('like');

  likeButton.addEventListener('click', function (event) {
    event.preventDefault();
    // actual like implementation
  });
</script>
...