Etkinlik dinleyicisi nasıl eklenir, kaldırılır ve tekrar eklenir?

Question

Geçerli ayı gösteren bir krom takvim uygulamasına sahibim. Ayrıca, hangi ayın görüntülendiğine bağlı olarak bir sonraki ve bir önceki aya gidip gelecek Ay ve Önceki ay düğmelerine sahibim. Ancak, takvimi yalnızca cari yılın Aralık ayına ve o yıla ait Ocak ayına kadar gitmesini isterim, bu yüzden kullanıcı aralık/ocak'a ulaştıktan sonra olay işleyicisini kaldırırım. Ancak, Aralık veya Ocak olmadığı zaman etkinlik işleyicisini tekrar eklemem gerekiyor. Bunu nasıl yapmalıyım?

var count = 0; 


var updated = setInterval(function() { 

var v = document.getElementById("CalendarMonth").innerHTML; 

updatedMonth = months.indexOf(v); 

}, 1000); 




document.getElementById("nextMonth").addEventListener("click", nxtMonth); 

function nxtMonth() 
{ 
    count = count +1; 


    if(nextMonth == 11) 
    { 
     console.log("the year has ended!"); 
     document.getElementById("nextMonth").removeEventListener("click", nxtMonth); 
    } 

else 
{ 
    nextMonth = updated + count; 
//ideally, this would work. But for some reason it does not 
    document.getElementById("nextMonth").addEventListener("click", nxtMonth); 

} 

document.getElementById("previousMonth").addEventListener("click", prevMonth); 

function prevMonth() 
{ 
    count = count -1; 


if(previousMonth == -1) 
     { 
     console.log("the year has just started!"); 

        document.getElementById("previousMonth").removeEventListener("click", prevMonth); 
     } 
     else if(count==-1) 
     { 
     previousMonth =1; 
     } 

     else 
     { 
      previousMonth = updated + count; 
      document.getElementById("previousMonth").addEventListener("click", prevMonth); 

     } 

Answer 1

Eh ben daha basit bir yaklaşım sadece tıklama işleyicisi kaldırmaz ve bunun yerine sadece geçerli ayı arttırılması/azaltılması hemen önce dönmek olacağını düşünüyorum.

Yani örneğin gelecek ay işleyici olacaktır:

if (nextMonth == 11) { 
    return; 
} 
count++; 

Answer 2

bakış kullanılabilirlik açısından basit ve daha şık bir çözüm sadece "gelecek ayın her biri için başka olay işleyicisi, bir eklemek olacaktır "ve" önceki aylar "düğmeleri, sınırlardan birine ulaşıldığında bunları devre dışı bırakmak için kullanılır. Bu sayede, tarayıcı sizin için çalışacaktır (kullanıcının bunları tıklamalarına izin vermeyecektir) ve kullanıcı da, bu sınırlara ulaştıklarını gösteren görsel geri bildirimi alacaktır.

function checkMonth(currentMonth) 
{ 
    if(currentMonth == 12){ 
     document.getElementById("nextMonth").disabled = true; 
    } else { 
     document.getElementById("nextMonth").disabled = false; 
    } 

    if(currentMonth == 1){ 
     document.getElementById("previousMonth").disabled = true; 
    } else { 
     document.getElementById("previousMonth").disabled = false; 
    } 
} 

Bu düğmeyi, iki düğme için zaten varolan olay işleyicilerinizde çağırın.

Bu işlevi kontrol etmedim ve belki biraz daha optimize edebilirsiniz, ancak bu benim sahip olduğum yaklaşım.