есть форма в которой польз. может добавлять изображения и при необходимости удалять его. Нужно сделать так чтобы при нажатии на кнопку, инпут очищался и можно было заново добавлять изображения. Сейчас проблема состоит в том что после того как я нажал на кнопку, то визуально все удалилось, но при попытке заново загрузить туже картинку что удалил, ничего не происходит. Как можно это решить?
HTML
<div class="cart-block__imgs">
</div>
<input class="cart-block__input-file" name="cart-block__input-file" accept="image/*" id="cart-block__input-file" type="file">
<label for="cart-block__input-file" class="cart-block__input-file_btn">Прикрепить фото</label>
JS
if(cartBlockInputFile) {
cartBlockInputFile.forEach(el => {
el.addEventListener('change', (event) => {
const infoPhoto = {};
const target = event.target;
const reader = new FileReader();
const file = target.files[0];
infoPhoto.name = file.name;
reader.readAsBinaryString(file);
reader.addEventListener('load', event => {
infoPhoto.base64 = btoa(event.target.result);
const cartBlockFileMask = `
<div class="cart-block__img-file">
<span class="cart-block__file-mask">${file.name}</span>
<button type="button" class="cart-block__file-btn-close"><img src="assets/img/close.svg" alt="Закрыть"></button>
</div>
`;
cartBlockImgs.forEach(el => {
el.insertAdjacentHTML('beforeend', cartBlockFileMask)
});
const cartBlockFileBtnClose = document.querySelectorAll('.cart-block__file-btn-close');
if(cartBlockFileBtnClose) {
cartBlockFileBtnClose.forEach(btn => {
btn.addEventListener('click', () => {
const item = btn.closest('.cart-block__img-file');
item.remove();
el.innerHTML = el.innerHTML; // то что я нашел в гугле, но оно не работает
});
});
}
});
});
});
}
Нашел решение, оказывается обычная очистка значения работает и на файл.
btn.addEventListener('click', () => {
const item = btn.closest('.cart-block__img-file');
item.remove();
el.value = ''; // ключевая строка
});
Помогло
Айфон мало держит заряд, разбираемся с проблемой вместе с AppLab
Я хочу запускать функцию не теряя контекст, но при этом имея возможность не привязываться к количеству аргументов
Ясно, что при нажатии на ultabs__caption происходит событие и что дальше?
У меня имеются два метода, которые задают фон отдельному блокуПервый метод задаёт сплошной фон, а второй - градиент