CODEWITHSUNDEEP
javascript
Noobster
Noobster

Reputation: 1044

Concatenating strings in javascript results in missing period

I am trying to output an image dynamically but am stumbling on a bizarre issue where javascript deletes a period (full stop in British English). This means the output file location is incorrect and I get error 404.

Say:

var resultX = 10

Would you happen to know why:

'<img style="margin-left:30px;" src="Images/Icons/' + parseInt(resultX * 10) + '.png" />\'

outputs src:

https//localhost/Images/Icons/100png

and not 

https//localhost/Images/Icons/100.png

The script works if I amend the last bit to + '..png" />\'

Edit

I have removed the penultimate character \ as suggested. The issue persists.

Upvotes: 0

Views: 97

Answers (3)

Sampath1504
Sampath1504

Reputation: 131

Try using template literals. It worked for me. 

var resultX = 10;
var output =`<img style="margin-left:30px;" src="Images/Icons/${resultX*10}.png"/>`
console.log(output)

Upvotes: 1

Rishikesh Dhokare
Rishikesh Dhokare

Reputation: 3589

Remove the \ at the end and your code is good enough. This is what i tried in chrome developer tools.

enter image description here

Upvotes: 3

Khoi Ngo Nguyen
Khoi Ngo Nguyen

Reputation: 174

I think you made redundant "\" in

'<img style="margin-left:30px;" src="Images/Icons/' + parseInt(resultX * 10) + '.png" />\'

When I remove it

(function(){
        var resultX = 10;
        var str = '<img style="margin-left:30px;" src="Images/Icons/' + parseInt(resultX * 10) + '.png" />';
        $('.row').append(str);
    })();

it will show:

<img style="margin-left:30px;" src="Images/Icons/100.png">

Upvotes: 3

Related Questions