Question

last night I was coding a little piece of JS code that records the number of mouse clicks on a keypad (akin to a mobile phone) and with each successive press a new value would be entered into a textbox. This is how I’ve got so far.

The difficulty last night was that I set count as a global variable which was carried across meant if a user clicked on 1 and 2 they would get 1D in the text box when they should be getting 12:

http://jsfiddle.net/JNCCW/7/

In my most recent code I’ve tried to create an array so initially we have:

[0,0,0,0]

And each time the user clicks a button then e.g 1 and then 2 – the array updates to:

[1,1,0,0]

The values at 1 in array 1,2 are then added to the text box.

When the array element equals 4 then the array element resets to 0.

http://jsfiddle.net/JNCCW/9/

I’ve been having difficulty achieving this and feel that the logic behind my coding is awkward. I would appreciate any help!

Answer 1

You need to store the id of element where you start counting index:

var count = 0
var elId;
function input(number) {
    if (elIf != number) {
        elId = number;
        count = 0;
     }

    number = number.split(".");
    document.getElementById('search').value += number[count];
    count++;
    if (count == 4) {
        count = 0;
    }
}

http://jsfiddle.net/JNCCW/15/

update: http://jsfiddle.net/JNCCW/19/