0

I've double checked and triple checked for typos numerous times and I'm sure the file paths are correct.

Basically what I'm trying to do is toggle through a bunch of images on my pc all located in the same folder. I've copied every img file's complete file path and set them as separate string values in an array.

With simple html, I've set the src attribute of the img element to a complete file path to an img. Onload, the img is loaded, no problem.

However, utilizing javascript just to test the waters, I've written a function to be invoked by click of a button to reset the src attribute's string value to another file in the array. No matter which file path I set it to with javascript, I get the same err_file_not_found issue.

js:

var btn = document.getElementById('butn');
var img_element = document.getElementById('imgElement');

var picArray = [
    "C:\Users\pcName\picFolder\pic1.jpg",
    "C:\Users\pcName\picFolder\pic2.jpg",
    "C:\Users\pcName\picFolder\pic3.jpg"
];

btn.onclick = function() {

    img_element.src = picArray[2];

};

<button id="butn">click</button>
<img src="C:\Users\pcName\picFolder\pic1.jpg" />

<!--img src="C:\Users\pcName\picFolder\pic3.jpg" will load no problem
if written html-->
Scott Miller
  • 57
  • 4

2 Answers2

1

You're getting the image elements by id imgElement but in your HTML there is no such id is associated with the img tag. edit your HTML to <img id='imgElement' src="C:\Users\pcName\picFolder\pic1.jpg" />

Zainul Abideen
  • 1,829
  • 15
  • 37
0

You can't refer to the picture as an absolute file path on your local computer.

You need to put the images in the same folder, or a subfolder, then reference the image by relative path.

Qiong Wu
  • 1,504
  • 1
  • 15
  • 27