Что я делаю не так, внутри скрипта?

Question

[faleaksey]

Всем привет! я новичок, поэтому строго не судите,вопрос вот в чём: имеются несколько одинаковых счётчиков на странице, у каждого есть кнопка увеличения и уменьшения... как сделать так, чтобы срабатывало у каждого по отдельности а не сразу всё вместе?

var dropdown = document.querySelectorAll('.countProduct');
var dropdownArray = Array.prototype.slice.call(dropdown, 0);
dropdownArray.forEach(function (el) {
    var quantityArrowMinus = el.querySelector('.countProduct__btn--dec');
    var quantityArrowPlus = el.querySelector('.countProduct__btn--inc');
    var quantityNum = el.querySelector('.countProduct__input');

    // console.log(quantityNum);
    // console.log(quantityArrowPlus);

    quantityArrowMinus.click(quantityMinus);
    quantityArrowPlus.click(quantityPlus);
    
    function quantityMinus() {
        if (quantityNum.val() > 1) {
            quantityNum.val(+quantityNum.val() - 1);
        }
    }
    
    function quantityPlus() {
        quantityNum.val(+quantityNum.val() + 1);
    }
});

ссылка на песочницу: ссылка

Answer 1

[Ао]

Скажи а ты сам понимаешь что в коде написано ? Ты его не сам писал ?
Ну я тоже могу тупить конечно но ты чёто не то сделал.
Назначь на input уникальный id , а на кнопки повесь событие onclick="quantityMinus('input_id')" и quantityPlus('input_id')
и напиши две функции

<div class="countProduct">
<input class="countProduct__input" type="number" name="countProdict_id1" id="countProdict_id1" value="1">
<button type="button" onclick="quantityMinus('countProdict_id1')" class="countProduct__btn countProduct__btn--inc">
-
</button>
<button type="button" onclick="quantityPlus('countProdict_id1')" class="countProduct__btn countProduct__btn--dec">
+
</button>
</div>
                                            
<div class="countProduct">
<input class="countProduct__input" type="number" name="countProdict_id2" id="countProdict_id2" value="1">
<button type="button" onclick="quantityMinus('countProdict_id2')" class="countProduct__btn countProduct__btn--inc">
-
</button> 
<button type="button"   onclick="quantityPlus('countProdict_id2')" class="countProduct__btn countProduct__btn--dec">
+
</button>
</div>

function quantityMinus(target) {
    	let input = document.getElemetById(target);
        if (input.value > 1) {
            input.value= input.val() - 1;
        }
    }
    
    function quantityPlus(target) {
    let input = document.getElemetById(target);
        input.value = input.value + 1;
    }

и постарайся не мешать jquery с vanilla js? лучше пиши всё на чистом js , jquery отупляет