LeWarEnds Ответов: 1

Увеличение значения при нажатии кнопки.

Я пытаюсь увеличить значение, написанное на кнопке, начиная с 0, и увеличивать его до тех пор, пока пользователь не перестанет нажимать на кнопку.
Например: если пользователь нажал кнопку один раз, значение должно увеличиться с 0 до 1, а затем, если он нажал снова, то значение должно быть от 1 до 2.

Что я уже пробовал:

Вот мой HTML код:
<div class="button">
  <button type="button" class="btn">0</button>
</div>


И мой файл Javascript: 
var buttonTarget = document.getElementsByClassName("btn");
var counter = 0;

function incrementer(){
  buttonTarget.innerHTML = counter.toString();
  counter++;
  return counter;
}


Что я делаю не так? Любая помощь будет оценена по достоинству :)

GKP1992

Попробуйте вызвать функцию инкремента при нажатии кнопки.

1 Ответов

Рейтинг:
12

Bryian Tan

Вот мои комментарии.

1. Как предложил другой участник, вам нужно обновить код, чтобы подключить событие нажатия кнопки.

2. getElementsByClassName возвращаем массив объекта, предполагая, что вы хотите, чтобы код получил доступ к первой кнопке, тогда код должен выглядеть как document.getElementsByClassName("btn")[0];

3. начальное текстовое значение кнопки равно 0 при загрузке страницы, поэтому при нажатии кнопки счетчик должен показывать 1, либо переместите счетчик++; наверх, либо запустите счетчик с 1

4. Вы также можете обновить кнопку, чтобы включить id атрибут i и используемый JavaScript getElementById метод

<div class="button">
  <button type="button" class="btn" id="btn" onclick="incrementer()">0</button>
</div>


var buttonTarget = document.getElementsByClassName("btn")[0];
var counter = 1;

function incrementer(){
//document.getElementById("btn").innerHTML = counter.toString();
  buttonTarget.innerHTML  = counter.toString();
  counter++;
  return counter;
}



Document.getElementsByClassName() | MDN[^]