Использование Croppie.js для загрузки нескольких файлов одновременно ⇐ Javascript

[Anonymous]

Вернуться в стек, я прихожу. Итак, я пытался сделать это многофайлом. Откровенно откровенно отправило меня в круги. Методы Croppie находятся на этой переменной.

• У вас есть шаг инициализации: $ uploadcrop.croppie ({... Свойства ...}) .
• Затем Bind: $ uploadcrop.croppie ('bind', {... Properties ...}) {
  
  let cropInstance = document.createElement("div")
  cropInstance.setAttribute('id', 'picPreview' + i)
  cropInstance.setAttribute('class','col-sm-4 float-end picPreview')
  let cropImageInstance = document.createElement('img')
  cropImageInstance.setAttribute('id', 'blah' + i)
  cropImageInstance.setAttribute('src', '#')
  cropImageInstance.setAttribute('alt', 'your image')
  croppieRow.appendChild(cropInstance)
  cropInstance.appendChild(cropImageInstance)
  
  //Croppie profile pic
  let $uploadCrop = $('#blah'+i).croppie({
  viewport: {
  width: 300,
  height: 350,
  type: 'square'
  },
  enableResize: true,
  boundary: {
  height: 400
  }
  })
  var reader = new FileReader();
  $origName = []
  $origName.push(file.name);
  reader.onload = (e) => {
  console.log('i = ' + i)
  $('#picPreview' + i).addClass('ready');
  $uploadCrop.croppie('bind', {
  url: e.target.result,
  orientation: 4,
  zoom: 0,
  viewport: {
  width: 300,
  height: 300,
  type: 'square'
  },
  boundary: {
  height: 400
  }
  
  }).then(() => {
  console.log('jQuery bind complete');
  }).catch((error) => {
  console.log(error);
  });
  
  };
  
  reader.readAsDataURL(input.files);
  
  i++
  
  });
  [/code]
  Здесь есть рабочий код для создания правильного количества DOV и назначения идентификаторов и классов, необходимых для работы Croppie, и поместите 1 изображение в каждую коробку Croppie, как это:
  
  
  Подробнее здесь: https://stackoverflow.com/questions/795 ... es-at-once