ajax и элементы с одинаковым классом

#php #html #jquery #ajax

Есть несколько блоков с одинаковым классом, по тыку срабатывает функция, которая
сравнивает текст блока с полем из таблицы в бд, и после выборки выводит по нему информацию.
Пока был один блок с классом, на который было наложено событие, все прекрасно отрабатывало,
добавил второй - перестало выводить что-либо. Собственно вопрос: Как нормально реализовать
это, в дальнейшем блоки буду выводить циклом?



function getDetails() {
var name = $('.catName').text();

$.ajax({
    type: 'POST',
    url: 'demo.php',
    data: {nickname:name},
    success: function (data) {
        $('.catInfo').html(data);
    }
});

}
Мурзик
Барсик










    

Ответы

Ответ 1

нормально реализовать это так:



$(".catName").click(getDetails);

function getDetails(e) {
  var div = this;
  $.ajax({
    type: 'POST',
    url: 'demo.php',
    data: {
      nickname: $(div).text()
    },
    success: function(data) {
      $(div).html(data);
    }
  });
  console.log("clicked - " + $(div).text());
}

Мурзик
Барсик


Ответ 2

Вы в этой строчке получаете все элементы с селектором .catName, а это 2 элемента!,
они будут склеиваться.
var name = $('.catName').text();