Блог

Главная - Вопросы по программированию - как просмотреть много изображений одновременно?

как просмотреть много изображений одновременно?

#javascript

#javascript

Вопрос:

Я написал этот код, но я могу просмотреть только одно изображение, но я хочу просмотреть несколько изображений одновременно. вот мой код

 var loadFile = function(event) {
  var image = document.getElementById('output');
  image.src = URL.createObjectURL(event.target.files[0]);
}; 
 <p>
  <input type="file" accept="image/*" name="image" id="file" 
  onchange="loadFile(event)" style="display: none" />
</p>
<button>
  <label for="file" style="cursor: pointer">Upload to Album two</label>
</button>
<p><img id="output" width="200" /></p>

Ответ №1:

Один из способов — динамически создать изображение и добавить его к объекту-оболочке (в данном случае к абзацу) вместо использования предварительно созданного тега изображения.

 var target = document.getElementById('output');
var loadFile = function (event) {
  var image = document.createElement('img');
  image.src = URL.createObjectURL(event.target.files[0]);
  target.appendChild(image)
}; 
  <p>
      <input
        type="file"
        accept="image/*"
        name="image"
        id="file"
        onchange="loadFile(event)"
        style="display: none"
      />
    </p>
    <button>
      <label for="file" style="cursor: pointer">Upload to Album two</label>
    </button>
    <p id="output"></p>

Комментарии:

1. А затем, когда это будет сделано, каждое изображение должно быть добавлено в formdata