На новом проекте столкнулся с проблемой: при нажатии на кнопку "показать еще", которая подгружает следующую порцию товаров, все события (добавить в корзину, в избранное и т.д.) начинали срабатывать повторно.
При этом при втором нажатии на "показать еще" все события утраивались.
Дело оказалось в том, что после загрузки новых товаров, чтобы новые кнопки, например, "добавить в корзинку" и другие события работали, каждый раз вызывался код:
$(".add_to_cart").on( "click", function (event){
...
});
- пример упрощенный
Проблема в том, что обработчик привязывался не только к новым товарам, но и повторно добавлялся к уже существующим.
Лучшим решением было бы сделать обработчик не на каждую кнопку, а на их общего родителя, а уже внутри проверять на какую кнопку было нажатие, но переписывать пришлось бы довольно много. В таком случаи решением может послужить удаление обработчиков со всех элементов и добавление их по новой:
let aButtons = $(".add_to_cart");
aButtons.off();
$(".add_to_cart").on( "click", function (event){
...
});