Why isn't my JavaScript variable working?

Question

This works:

$('.sameDiv').css('width', '25%');

But this doesn't:

var squaresize = 25;
$('.sameDiv').css('width', 'squaresize%');

Also, I've tried it with the percent symbol as part of the variable and that doesn't help.

What made you think JavaScript would substitute variable names in strings? Given `var foo = 42;` did you think that `var bar = 'foobar';` would be turned into `'42bar'`? — Felix Kling, Oct 13 '14 at 01:08
possible duplicate of [JavaScript adding a string to a number](http://stackoverflow.com/questions/16522648/javascript-adding-a-string-to-a-number) — ProllyGeek, Oct 13 '14 at 01:16
For things that are JQuery + Javascript, it's often better to use JQuery in the title instead of Javascript, to get the right folks to answer. — Dean J, Oct 27 '14 at 00:05

Michael Voznesensky · Accepted Answer · 2014-10-13T01:02:41.597

6

$('.sameDiv').css('width', 'squaresize%');

Should become

$('.sameDiv').css('width', squaresize + '%');

I did not test it, but if you just put 'squaresize%' it will not try to reference it... rather, just read it directly as a literal string evaluating to "squaresize%" instead of 25%

edited Oct 13 '14 at 01:02

answered Oct 13 '14 at 00:54

Michael Voznesensky

1,612
12
15

Please wrap `.sameDiv` in string delimiters… – Bergi Oct 13 '14 at 01:01

score 1 · Answer 2 · edited Oct 26 '14 at 01:51

1

Your code should be like:

var squaresize = 25;

$(".sameDiv").css('width', squaresize+'%');

Your variable name is "squaresize". Knowing that when adding a string to an integer will produce a string as well, there is no need to convert your integer to a string. Just add the "%" to your variable value.

Using a single quote, you are setting css to value 'square%' as a static value.

edited Oct 26 '14 at 01:51

Peter Mortensen

30,738
21
105
131

answered Oct 13 '14 at 00:54

ProllyGeek

15,517
9
53
72

1

Please do not post solutions, but explain why as well! – Michael Voznesensky Oct 13 '14 at 01:00
@MichaelVoznesensky but you are right concerning explaining. – ProllyGeek Oct 13 '14 at 01:05
Per Bergi's comment in the other answer: Please wrap .sameDiv in string delimiters… – Steven Oct 13 '14 at 01:05
4

@ProllyGeek: FYI, the downvote tooltip text says "This answer is not useful". An answer can contain a correct solution but may not be useful. – Felix Kling Oct 13 '14 at 01:10
@FelixKling thanks for the information , but useful is not a digital value , it may vary from person to another such question doesnt really require answering i would flag it as noob question if there was such option. – ProllyGeek Oct 13 '14 at 01:13

Why isn't my JavaScript variable working?

2 Answers2