Подсчет количества кликов нажатием кнопки - PullRequest
Новая
       98

Подсчет количества кликов нажатием кнопки

1 голос
/ 06 марта 2020

Я новичок в кодировании и использую Lab. JS для проекта. У меня есть кнопка, которая при нажатии подсчитывает количество сделанных кликов, а затем регистрирует ее в консоли. Важно, чтобы количество нажатий не отображалось на экране при нажатии кнопки и было скрыто от человека, нажимающего кнопку. Я просто хочу, чтобы количество кликов было учтено, но я не уверен, как исправить код. IAny будет признательна за помощь. 

var clicks = 0;
trigger = function() {
clicks += 1;
document.getElementById("trigger").innerHTML = clicks;
}
console.log(clicks)
<button class="trigger" id="trigger" onclick="trigger()">SUBMIT</button>

Ответы [ 3 ]

1 голос
/ 06 марта 2020

Вместо обновления кнопки HTML вы можете добавить новый div и обновить его со счетчиком, например: 

var clicks = 0;
trigger = function() {
  clicks += 1;
  document.getElementById("display").innerHTML = clicks;
}
#display {
  padding: 20px;
  margin: 10px;
  font-size: 2rem;
}
<div id="display">0</div>
<button class="trigger" id="trigger" onclick="trigger()">SUBMIT</button>
1 голос
/ 06 марта 2020

Если вы не хотите иметь глобальную переменную clicks, вы можете инкапсулировать ее в самой функции и вернуть замыкание . 

// Default `clicks` to zero
function trigger(clicks = 0) {

  // Return a new function that increases
  // the click count
  return function () {
    console.log(++clicks);
  }
}

// Call trigger and assign the returned function
// to a new variable called counter
const counter = trigger();

// Move the inline `onclick` listener to the JS
// Call `counter` when the button is clicked
const button = document.querySelector('.trigger');
button.addEventListener('click', counter, false);
<button class="trigger">SUBMIT</button>
1 голос
/ 06 марта 2020

Пожалуйста, попробуйте этот код. 

  <body>
    <button onclick="trigger()">Click Me</button>
    <script>
      // Initiate a global variable a
      var a = 0;
      function trigger() {
        a++;
        console.log(a);
      }
    </script>
  </body>

Пока вы делаете вашу переменную глобальной. Это значение будет сохранено только для этой страницы, пока пользователь не закроет страницу или вкладку.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...