[SOLVED]How To Use Image Name with Spaces on HTML CSS Javascript

I have a javascript file and want to use bakground image url, but the image name has a space on it, and it won't appear on website, that's because Spaces are not valid in a URL. They need to be encoded to %20.

My image name is 'Mesin Logam.jpg'

setAttribute("fPath",f.fPath);
innerHTML="<div style='height:80px;background-image:url(../"+f.fPath+");background-size:80px 80px;background-repeat:no-repeat;padding:0px 0px 0px 85px'>"+f.fName+"</div>";

that code won't show the image, so we can use source.replace(/ /g, '%20'), replace source with the image name/ url variable, it will be like this

setAttribute("fPath",f.fPath);
var isiweb=f.fPath.replace(/ /g, '%20');
innerHTML="<div style='height:80px;background-image:url(../"+isiweb+");background-size:80px 80px;background-repeat:no-repeat;padding:0px 0px 0px 85px'>"+f.fName+"</div>";
the image name now become Mesin%20Logam.jpg and the browser can read it.
3 Responses



/* infolinks */