Javascript/HTML: How to implement a button that adds a click counter on click?
NickName:boolean_ring Ask DateTime:2018-01-16T02:03:31

Javascript/HTML: How to implement a button that adds a click counter on click?

I understand how to implement a single click counter. However, I am struggling to figure out how to implement a button that will duplicate the click counter, while also allowing me to use the same javascript code.

My current layout for a single click counter has a div for the counter then a button for incrementing and another for decrementing. For the buttons, I am using a separate event listener for each one.

<div id="counter">0</div>
<button id="increment">+1</button>
<button id="decrement">-1</button>

Javascript:

var incr = document.getElementById('increment');
var decr = document.getElementById('decrement');
incr.addEventListener('click', ...);
decr.addEventListener('click', ...);

How would I implement another button that would copy the counter? Also, how do I approach the javascript side? My current approach does not seem to generalize well for multiple counters.

Copyright Notice:Content Author:「boolean_ring」,Reproduced under the CC 4.0 BY-SA copyright license with a link to the original source and this disclaimer.
Link to original article:https://stackoverflow.com/questions/48268411/javascript-html-how-to-implement-a-button-that-adds-a-click-counter-on-click

More about “Javascript/HTML: How to implement a button that adds a click counter on click?” related questions

Javascript/HTML: How to implement a button that adds a click counter on click?

I understand how to implement a single click counter. However, I am struggling to figure out how to implement a button that will duplicate the click counter, while also allowing me to use the same

Show Detail

Javascript, increment a counter on button click

In javascript, I want to make a counter that increases the value when you click a button. When I click the add button the first time, the number doesn't increase. But when I print the value to ...

Show Detail

Button click counter in JavaScript

Here i have found a JavaScript button click counter that counts the no. of clicks on a button and saves the number in something called web storage, I don't know what that really is. One thing I kn...

Show Detail

Simple click counter using JavaScript

I am creating a simple little test game and my idea is a number '0' displays on the screen. When you click the number, it adds 1. I want the number counter to be infinite, so you can just keep clic...

Show Detail

HTML/Javascript Button Click Counter

I have done something similar to this before, and I know this is really close. I'm just trying to make it so that my button increments the javascript variable, and the function then displays the new

Show Detail

Button click counter

I'm trying to create a button click counter that on every download it increases. I want to use it without a database, this is the code: &lt;?php $counterFile = 'counter.txt' ; // jQuery ...

Show Detail

Button click counter (increment and save)

Can anyone help : The scenario is when the user1 click the button it will increment Example : user1 clicks 5 times and then the user2 when it clicks the next number will be 6. and then when the u...

Show Detail

Simple two button counter html jquery javascript

I am new to Jquery and Javascript. I've only done the intros for codeacademy and I have what I remembered from my python days. I saw this tutorial: http://www.codecademy.com/courses/a-simple-count...

Show Detail

javascript form button click counter

Good Morning. I am working on button click counter using javascript function. The tricky thing is button type is submit, so page is reloaded whenever I click this button . Here is the code which

Show Detail

Increase counter value upon button click

I cannot seem to get the jQuery bit I need to work. I've never used jQuery before, but I'd like to have a button on my page that, when clicked, increments an initially 0 value by one. My question is

Show Detail