Javascript incrementing by more than one

Question

 var x1 = document.getElementById("x1"); var x2 = document.getElementById("x2"); function ThisEvent(){// needs a lot of work done to it if (x1.value==1) { x2.value--; } else if (x1.value==2) { x2.value++; } else if (x1.value==3) { x2.value+=5; } } 

 <input type="text" value="0" id="x1" onblur="ThisEvent()"> x1 </br> <input type="text" value="0" id="x2"> x2 

what is happening now is the digit is being added instead of incrementing when 3 is the input if x1. how do you make it increment by more than just one, without it being added it as a digit?

Answer 1

if (x1.value == 3) {
    x2.value = parseInt(x2.value) + 5;
}

It's interpreting it as a string. You can parseInt the x2.value in the calculation.

Answer 2

The value of the input is a String , you need to convert it to a Number in order to perfom an addition on it.

You could do it like this:

function ThisEvent() { // needs a lot of work done to it
    var valX1 = Number(x1.value);
    var valX2 = Number(x2.value);
    if (valX1 == 1) {
        valX2--;
    } else {
        if (valX1 == 2) {
            valX2++;
        } else {
            if (valX1 == 3) {
                valX2 += 5;
            }
        }
    }
    x2.value = valX2;
}

jsFiddle: https://jsfiddle.net/v1utqv7f/