How to preview images when uploading with input type=[file]?

S

sazhyk2017-03-28 11:10:43

JavaScript

sazhyk, 2017-03-28 11:10:43

I did a preview for one uploaded image on this question . Everything is fine, but you need to do a preview for several images on the page. How to be? There, in the comments to the question, there is such a " sub-question "
I found an option where previews are made for a "pack" of images at once, but this does not suit me. Images are added manually to different inputs. It looks like this in the end
. Tell me how to implement this business?

Reply

Answer the question

In order to leave comments, you need to log in

4 answer(s)

M

Maxim Timofeev, 2017-03-28
@webinar

https://github.com/blueimp/jQuery-File-Upload
https://blueimp.github.io/JavaScript-Load-Image/
www.dropzonejs.com

D

dummyman, 2017-03-28
@dummyman

When you select files in input[type=file] with a dialog or drop them via dragndrop, you will have an array in input.files with local paths to user files. just create a new <img> and set src= to the local path to the image and the browser will pick it up from the local disk.

A

Anton Anton, 2017-03-28
@Fragster

https://developer.mozilla.org/en/docs/Using_files_...

A

alex maslakoff, 2017-03-28
@teke_teke

possible via FileApi in html5