When I upload 3 items named png1, png2, and png3, the result will be as follows:
alert 1
png1 / base64 string conversion
alert 2
png2 / base64 string conversion
alert 3
png3 / base64 string conversion
I experimented with this code snippet.
function readFile() {
var input = document.getElementById('gallery-photo-add');
var nameOfFile = "";
for (var i = 0; i < input.files.length; ++i) {
nameOfFile = input.files.item(i).name;
if (this.files && this.files[0]) {
var reader = new FileReader();
reader.addEventListener("load", function (e) {
alert(nameOfFile);
alert(e.target.result);
});
reader.readAsDataURL(this.files[0]);
}
}
}
document.getElementById("gallery-photo-add").addEventListener("change", readFile);<input type="file" multiple id="gallery-photo-add" style="overflow: auto;">