Кнопки JS с максимальным значением

Question

Я хотел создать две кнопки, которые увеличивают значение и останавливаются при максимальном значении, изменяя цвет кнопки на красный, чтобы указать, что кнопка больше не может быть нажата, и достигло максимального значения, затем кнопку сброса для отдыха все возвращается к 0. У меня есть часть кода, но я попытался добавить максимальное значение к кнопкам и кнопке сброса, но не работает. до сих пор это то, что у меня есть, что в основном увеличивает значение на 1 с каждым кликом. Кто-нибудь может помочь?

var button1 = 0; 
 
var button1 = 0; 
 

 
function onClick1() { 
 
    button1 += 1; 
 
    document.getElementById("button1").innerHTML = button1; 
 
}; 
 

 
function onClick2() { 
 
    button2 += 1; 
 
    document.getElementById("button2").innerHTML = button2; 
 
};

<button type="button" onClick="onClick1()">Click</button> 
 
<p><a id="button1">0</a> 
 
</p> 
 
<button type="button" onClick="onClick2()">Click</button> 
 
<p><a id="button2">0</a> 
 
</p>

Answer 1

Максимальное число в JS является Number.MAX_VALUE так

var button = document.getElementById("button1"); 
var i; 
var max = Number.MAX_VALUE; 
//The loop 
for(i = 0; i < max; i++) { 
button.textContent = i; 
} 
button.style.backgroundColor = "red"; 

Answer 2

Установить максимальные вары и логическая проверка.

var button1 = 0; 
var button1 = 0; 

var max1 = 25; 
var max2 = 25; 

function onClick1() { 
    if (button1 < max1){ 
     button1 += 1; 
     document.getElementById("button1").innerHTML = button1;  
    } 
}; 
    function onClick2() { 
    if (button2 < max2){ 
     button2 += 1; 
     document.getElementById("button2").innerHTML = button2; 
    } 
}; 

Answer 3

protip: использовать textContent не innerHTML, так как вы не изменяя содержание HTML.

Просто добавьте инструкцию if к вашим функциям.

var buttonElement = document.getElementById("button1"); 
if (++button > maxValue) { 
    buttonElement.style.backgroundColor = "red"; //grab button via variable, change color 
} else { 
    button1++; 
    buttonElement.textContent = button1; 
} 

Идет дальше, если вы действительно хотите сказать им, что «перестаньте меня нажимать!» просто отключите кнопку, когда вы измените цвет на красный.