Farklı sayıcılarda bir değişkeni nasıl kontrol edebilirim

Question

Bir sayaç tasarladım, her biri 3 düğmeli (yukarı, aşağı ve çıkarma sayacı). Ve sayacı ekleyebilirim. Her yeni sayaç harika çalışıyor, ancak diğer sayaçlar yeni tezgahtan saymaya devam ediyor. Sanırım n sayılar dizisi oluşturmalıyım ve n (i) için sayım yapmalı mıyım? Eğer doğruysa o zaman nasıl yapabilirim?

Bunu nasıl düzeltebilirim? Eğer bir eklerseniz -

var up = document.getElementsByClassName("up"); 
    var n = 0; 
    for (i = 0; i < up.length; i++) { 
     up[i].addEventListener("click", function(){ 
      var input = this.parentElement.getElementsByClassName("input"); 
        n++; 
        input[0].innerHTML = parseInt(input[0].innerHTML) + 1; 
     }); 
    }; 


    <button class="up">up</button> 
    <div class="input">0</div> 

Answer 1

Her 'yukarı' ve 'aşağı' eleman her zaman Yani sayfadaki ilk sayaçları her zaman tıklama işleyicisi almak upDownCounter()

çalıştırmak için olay dinleyicileri ekliyoruz console.log() olay dinleyicilerinizin içinde, eski sayaçlar için birden çok kez çalıştığını görürsünüz. Eğer 3 sayaçları varsa sadece sahip olmuş olacak şekilde

up[i].addEventListener("click", function(){ 
    console.log('up click' 
    ... 
}); 

, bir kez 1 yeni, daha sonra 3 kez "tıklayın yukarı" kaydedilir ilki üzerinde 'yukarı' tıklayın ikincisi iki kez kaydedecek ve olay dinleyicisi bir kez eklendi.

Ayrıca, siz de varyasyonunuzun kapalı olduğunu, n değişkeninizin tüm sayaçlarda ortak olduğunu, tıklama işleyicisinin içinde bildirilmesi gerektiğini düşünüyorum. Bunun yerine bu kullanabilirsiniz:

input[0].innerHTML = parseInt(input[0].innerHTML) + 1; 

kod olsa bazı üstlenmeden ile yapabilirdi, o kendisini çok tekrarlar ve takip etmek biraz zordur.