Почему этот event.target.previousElementSibling не работает? - PullRequest
Новая
       31

Почему этот event.target.previousElementSibling не работает?

1 голос
/ 11 марта 2019

, поэтому у меня есть этот код 

                    <div class="col-lg-12 video-meta">
                    <div class="container">
                        <span class="views"><i class="far fa-eye"></i>{{ Counter::show('post', $post->id) }}</span>

                        <span class="lnd">
                            <a class="like" href="#"><i class="far fa-thumbs-up"></i></a>
                            <a class="like" href="#"><i class="far fa-thumbs-down"></i></a>
                        </span>

, и я нацеливаю его на 

        $('.like').on('click', function(event) {
        event.preventDefault();
        var isLike = event.target.previousElementSibling == null;
        console.log(isLike);

, и он возвращает "true" в обоих случаях, почему ?!Для этого есть причина?Я был на нем в течение 4 часов прямо сейчас, и он работал ОДИН РАЗ, я ничего не менял, просто взял перерыв, а потом он не работал после моего перерыва?Я думаю, что это какая-то плохая шутка.что я здесь упускаю?

он должен в основном принимать класс "like", и, поскольку первый тег не имеет значения previousSiblingElement, равного нулю, он должен возвращать true, но второй содержит элемент с таким же тегом.как брат и по-прежнему возвращает истину ..

1 Ответ

2 голосов
/ 11 марта 2019

event.target - это элемент <i>, потому что это элемент, на котором действительно произошел щелчок.

Если вы хотите <a> (к которому вы подключили обработчик событий), вам нужно запросить event.currentTarget или даже просто this: 

$('.like').on('click', function(event) {
  event.preventDefault();
  console.log(event.target); // <i>
  
  var isLike = event.currentTarget.previousElementSibling == null;
  console.log(isLike);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="col-lg-12 video-meta">
  <div class="container">
    <span class="lnd">
      <a class="like" href="#"><i class="far fa-thumbs-up">a</i></a>
      <a class="like" href="#"><i class="far fa-thumbs-down">b</i></a>
    </span>
  </div>
</div>
...