Класс CSS, добавленный с помощью .on ('click'), не виден после первого события

Question

Я пытаюсь применить границу к динамически сгенерированному элементу, используя $ .on ('click') и $ .addClass (), но кажется, что класс не применяется к событию первого щелчка.В остальном работает нормально.Что я делаю не так?

$(document.body).on('click', '.card', function() {
  var currentSelection = $(this)
  var currentSelectionIndex = $(currentSelection).index()

  $(currentSelection).addClass("selected")

  if (currentSelectionIndex !== previousSelectionIndex) {
    p = $("#searchResponse").children().get(previousSelectionIndex)
    $(p).removeClass("selected")
  }

  previousSelectionIndex = currentSelectionIndex;
});

Решение: Назначение previousSelectionIndex значения в начале моего скрипта и устранение проблемы.

Answer 1

Мне не совсем понятен ваш вопрос, учитывая предоставленную информацию.

Однако, если я правильно понимаю проблему, у вас есть элемент контейнера с id="searchResponse", у которого много дочерних элементов с * 1004.* и вы, по сути, пытаетесь добавить class="selected" к определенной карточке при нажатии на нее, гарантируя, что только одна карточка за раз может быть «выбрана».Если это так ..

Выберите только одну карту за раз:

$('#searchResponse').on('click', '.card', function(){ $('.card.selected').removeClass('selected'); $(this).toggleClass('selected'); });

Если вам нужно выбрать и отменить выбор нескольких, попробуйте следующее:

$('#searchResponse').on('click', '.card', function(){ $(this).toggleClass('selected';) });

Рабочая кодовая ручка