Выполняется только последний скрипт

Question

<script type="text/javascript">
let input_item<?=$out_item2['id'] ?> = document.getElementById('cart_item<?=$out_item2['id'] ?>');
document.onclick  = event => {
    if (event.target.classList.contains('plus_button<?=$out_item2['id'] ?>')) {
        plusFunction<?=$out_item2['id'] ?>(event.target.dataset.id);
        renderCart<?=$out_item2['id'] ?>();
    }
    if (event.target.classList.contains('minus_button<?=$out_item2['id'] ?>')) {
        minusFunction<?=$out_item2['id'] ?>(event.target.dataset.id);
        renderCart<?=$out_item2['id'] ?>();
    }
}

// Увеличение кол-ва товара
const plusFunction<?=$out_item2['id'] ?> = id => {
    input_item<?=$out_item2['id'] ?>.value++;

}

// Уменьшение кол-ва товара
const minusFunction<?=$out_item2['id'] ?> = id => {
    if (input_item<?=$out_item2['id'] ?>.value > 1) {
    input_item<?=$out_item2['id'] ?>.value--;
    }
}
const renderCart<?=$out_item2['id'] ?> = () => {
    console.log(input_item<?=$out_item2['id'] ?>["value"]);
}
</script>

Скрипт, который при каждой итерации php цикла пишет код для одного элемента корзины. Весь день копался и узнал лишь то, что код не работает из-за того, что одна из переменных глобальная, но ошибку так и не нашёл.

Answer 1

<script type="text/javascript">
(function() {
  let input_item<?=$out_item2['id'] ?> = document.getElementById('cart_item<?=$out_item2['id'] ?>');
  document.addEventListener("click", event => {
    if (event.target.classList.contains('plus_button<?=$out_item2['id'] ?>')) {
        plusFunction<?=$out_item2['id'] ?>(event.target.dataset.id);
        renderCart<?=$out_item2['id'] ?>();
    }
    if (event.target.classList.contains('minus_button<?=$out_item2['id'] ?>')) {
        minusFunction<?=$out_item2['id'] ?>(event.target.dataset.id);
        renderCart<?=$out_item2['id'] ?>();
    }
  });

  // Увеличение кол-ва товара
  const plusFunction<?=$out_item2['id'] ?> = id => {
    input_item<?=$out_item2['id'] ?>.value++;
  }

  // Уменьшение кол-ва товара
  const minusFunction<?=$out_item2['id'] ?> = id => {
    if (input_item<?=$out_item2['id'] ?>.value > 1) {
      input_item<?=$out_item2['id'] ?>.value--;
    }
  }

  const renderCart<?=$out_item2['id'] ?> = () => {
    console.log(input_item<?=$out_item2['id'] ?>["value"]);
  }
})();
</script>

БЛОГ НА HUSL

Выполняется только последний скрипт

Ответы (1 шт):