How do I add an integer value with javascript (jquery) to a value that's returning a string?

Question

I have a simple html block like:

<span id="replies">8</span>

Using jquery I'm trying to add a 1 to the value (8).

var currentValue = $("#replies").text();
var newValue = currentValue + 1;
$("replies").text(newValue);

What's happening is it is appearing like:

81

then

811

not 9, which would be the correct answer. What am I doing wrong?

score 189 · Accepted Answer · edited Mar 23 '12 at 22:41

189

parseInt() will force it to be type integer, or will be NaN (not a number) if it cannot perform the conversion.

var currentValue = parseInt($("#replies").text(),10);

The second paramter (radix) makes sure it is parsed as a decimal number.

edited Mar 23 '12 at 22:41

m90

11,434
13
62
112

answered Jan 20 '09 at 05:08

Diodeus - James MacFarlane

112,730
33
157
176

10

Be careful of parseInt(), it recognizes "010" as 9 (values leading with a zero are parsed as octal). – MightyE Jul 13 '10 at 17:36
3

Bleh, "010" parses as 8 (not 8) – MightyE Jul 13 '10 at 18:42
7

@Jacob Relkin : Since this was useful, I just gave him another +1. If you know of a better answer, it's a pity you didn't share it. – ANeves Apr 04 '11 at 22:37
I've come here with google about 3 times already. wish I could vote up thrice :p – iamserious Sep 05 '11 at 11:09
Why the `10` as the 2nd parameter? Doesn't `parseInt` by default parses in base 10? – hobbes3 May 11 '12 at 17:19
1

It does, unless it detects a leading zero, then it becomes octal. A simple glitch when accepting user input. – Diodeus - James MacFarlane May 11 '12 at 17:38
1

It works fine as long as you specify the radix by using the second parameter: `parseInt("010", 10)` returns ten. – jahroy Sep 27 '12 at 21:29
If the input string begins with "0", radix is eight (octal) or 10 (decimal) [is used]. Exactly which radix is chosen is implementation-dependent. ECMAScript 5 specifies that 10 (decimal) is used, but not all browsers support this yet. For this reason always specify a radix when using parseInt. - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/parseInt – Torin Finnemann Apr 11 '16 at 11:17

score 29 · Answer 2 · answered May 15 '11 at 23:09

29

Parse int is the tool you should use here, but like any tool it should be used correctly. When using parseInt you should always use the radix parameter to ensure the correct base is used

var currentValue = parseInt($("#replies").text(),10);

answered May 15 '11 at 23:09

Jon P

19,442
8
49
72

score 28 · Answer 3 · answered Jan 20 '09 at 05:10

28

The integer is being converted into a string rather than vice-versa. You want:

var newValue = parseInt(currentValue) + 1

answered Jan 20 '09 at 05:10

Chuck

234,037
30
302
389

score 12 · Answer 4 · answered Jan 22 '13 at 09:05

12

parseInt didn't work for me in IE. So I simply used + on the variable you want as an integer.

var currentValue = $("#replies").text();
var newValue = +currentValue + 1;
$("replies").text(newValue);

answered Jan 22 '13 at 09:05

Gareth Nel

217
2
7

score 5 · Answer 5 · answered Jan 21 '11 at 22:05

5

In regards to the octal misinterpretation of .js - I just used this...

parseInt(parseFloat(nv))

and after testing with leading zeros, came back everytime with the correct representation.

hope this helps.

answered Jan 21 '11 at 22:05

Bill Ortell

837
8
12

score 2 · Answer 6 · answered Aug 21 '13 at 13:34

2

Simply, add a plus sign before the text value

var newValue = +currentValue + 1;

answered Aug 21 '13 at 13:34

Agorreca

684
16
31

score 2 · Answer 7 · answered Nov 15 '10 at 14:08

2

to increment by one you can do something like

  var newValue = currentValue ++;

answered Nov 15 '10 at 14:08

alex

646
9
19

score 2 · Answer 8 · edited May 03 '16 at 13:10

2

Your code should like this:

<span id="replies">8</span>

var currentValue = $("#replies").text();
var newValue = parseInt(parseFloat(currentValue)) + 1;
$("replies").text(newValue);

Hacks N Tricks

edited May 03 '16 at 13:10

Izzy

402
6
16

answered Apr 21 '11 at 10:35

rajeev

21
1

score 1 · Answer 9 · edited Oct 21 '12 at 01:19

1

var month = new Date().getMonth();
var newmon = month + 1;
$('#month').html((newmon < 10 ? '0' : '') + newmon );

I simply fixed your month issue, getMonth array start from 0 to 11.

edited Oct 21 '12 at 01:19

j.w.r

4,136
2
27
29

answered Jun 09 '12 at 11:13

Adeel Ishfaq

11
1

score 1 · Answer 10 · answered Jan 22 '15 at 20:14

You can multiply the variable by 1 to force JavaScript to convert the variable to a number for you and then add it to your other value. This works because multiplication isn't overloaded as addition is. Some may say that this is less clear than parseInt, but it is a way to do it and it hasn't been mentioned yet.

score -1 · Answer 11 · answered Mar 23 '19 at 05:41

-1

You can use parseInt() method to convert string to integer in javascript

You just change the code like this

$("replies").text(parseInt($("replies").text(),10) + 1);

answered Mar 23 '19 at 05:41

Codemaker2015

12,190
6
97
81

1

How is this different from above posted answer ( which are posted around 10 year ago ) ? – Code Maniac Mar 23 '19 at 05:49

How do I add an integer value with javascript (jquery) to a value that's returning a string?

11 Answers11

Linked

Related