Нажмите внутри l oop, щелкнув все элементы

Question

Я получил некоторые данные от ajax и l oop через него, чтобы сделать карты. У меня есть клик внутри моего l oop. предполагается, что при щелчке захватывается объект данных индекса, но каждый раз, когда я щелкаю первый элемент, он захватывает все объекты из массива. Я пытался изменить свой для l oop на a для каждого перемещения функции за пределы l oop и привязать к нему «this», но безрезультатно. любая помощь?

enter code here $.ajax({
url: "/user",
method: "POST" }).then(res => {
console.log(res);
let friend = res.request;
for (i = 0; i < friend.length; i++) {
  var html2 =
    "<div class='ui card'><div class='card' id='rcard'> <div class='content'> <img class='right floated mini ui image' id='rpic' src = '" +
    friend[i].picture +
    "<div class='header'>" +
    friend[i].username +
    "</div><div class='meta'>" +
    friend[i].Email +
    "</div><div class='description'>" +
    friend[i].username +
    "  would like to be your friend </div></div><div class='extra content'><div class='ui two buttons'><div class='ui basic green button' id='accept'>Approve</div> <div class='ui basic red button' id='decline'>Ignore</div></div> </div></div>";
  friend[i].picture
    ? friend[i].picture
    : $("#rpic").attr(
        "src",
        "https://icons-for-free.com/iconfiles/png/512/business+costume+male+man+office+user+icon-1320196264882354682.png"
      );
  $("#cardcontainer").append(html2);
  $(".ui.basic.green.button").click(i => {
    console.log("hello");
    var data = { data: friend[i] };

Answer 1

Поскольку вы используете $(".ui.basic.green.button"), он получает все элементы на странице, имеющие этот класс. Поэтому в вашем коде попробуйте изменить

$(".ui.basic.green.button") на $(".ui.basic.green.button")[i].

Надеюсь, это поможет !!

Answer 2

$(".ui.basic.green.button") захватывает все элементы на вашей странице, имеющие селектор .ui.basic.green.button, он не ограничивается элементом l oop.

Так что при каждом l oop вы отображаете карту ( ) для ВСЕХ .ui.basi c .green.button вашей страницы.

Итак, когда вы нажимаете кнопку, когда она отображается на все объекты, они все выполняются.