У меня есть код, который добавляет новую строку в таблицу, нажав кнопку «Добавить строку». Единственное поле в этой строке — это тип файла.
Входной файл скрыт и заменен на «загрузить изображение». когда я выбираю изображение, вместо «загрузить изображение» отображается предварительный просмотр изображения.
Проблема вот в чем: когда я добавляю новую строку, она работает только для первой строки.
$(document).ready(function() { вар я = 1; $("#add_row2").click(function() { $('#addrQual' + i).html("" + (i + 1) + "
"); $('#tab_logicQual').append(''); я++; }); $("#delete_row2").click(function() { если (я > 1) { $("#addrQual" + (i - 1)).html(''); я--; } }); }); $('div').on('click', '.closeDiv', function() { $(this).prev().remove(); $(это).удалить(); $('#upload-file').val(""); $('.image-upload').css('display', 'block'); }); var fileDiv = document.getElementById("upload"); var fileInput = document.getElementById("загрузить-файл"); fileInput.addEventListener("изменение", функция(e) { вар filesVAR = this.files; showThumbnail (filesVAR); }, ЛОЖЬ); функция showThumbnail(файлы) { вар файл = файлы [0] var миниатюра = document.getElementById("миниатюра"); var pDiv = document.createElement("div"); var image = document.createElement("img"); var div = document.createElement("div"); pDiv.setAttribute('класс', 'pDiv'); миниатюра.appendChild(pDiv); image.setAttribute('класс', 'img-preview'); pDiv.appendChild (изображение) div.innerHTML = "х"; div.setAttribute('класс', 'closeDiv'); pDiv.appendChild(div) изображение.файл = файл; вар-ридер = новый FileReader() reader.onload = (function(aImg) { возвращаемая функция(е) { aImg.src = e.target.result; }; }(изображение)) вар ret = readAsDataURL(файл); var Canvas = document.createElement("холст"); ctx = Canvas.getContext("2d"); image.onload = функция() { ctx.drawImage(изображение, 100, 100); $('.image-upload').css('дисплей', 'нет'); } }; .image-upload>input { дисплей: нет; } .attach-док { курсор: указатель; } .img-предварительный просмотр { высота: 75 пикселей; граница: 1 пиксель, сплошная #000; поле: 10 пикселей 5 пикселей 0 0; плыть налево; } .closeDiv { позиция: абсолютная; курсор: указатель; выравнивание текста: по центру; цвет: #fff; высота: 20 пикселей; ширина: 20 пикселей; радиус границы: 50 пикселей; фон: rgba(255, 0, 0, 1); поле: 2–10 пикселей; } .pDiv { плыть налево; Добавить строку Удалить строку # Изображение Имя Тип 1
Мобильная версия