Obtuve el trabajo para agregar una función de eliminación a una entrada html con el tipo "archivo", que puede eliminar un solo archivo de una lista de varios archivos. Como puede ver en el fragmento a continuación, eliminar todos los archivos a la vez es fácil, pero mi función para eliminar un archivo en un índice determinado no funciona.
function remove(i){ document.getElementById('files').files.splice(i, 1); } function removeAll(){ document.getElementById("files").value=null; } <input id="files" type="file" multiple="multiple"> <button onclick="remove(1)">delete 1st</button> <button onclick="remove(2)">delete 2nd</button> <button onclick="remove(3)">delete 3rd</button> <button onclick="removeAll()">delete all</button> ¿Hay alguna forma de hacer que esta función remove() funcione?
Primero debe convertir el objeto de document.getElementById('files') en una matriz. También .splice() devuelve los elementos eliminados. Por lo tanto, debe almacenar la matriz en una variable. Después de usar .splice() en esta matriz, la matriz contendrá los elementos restantes:
function remove(i){ var myFiles = Object.entries(document.getElementById('files').files) Object.entries(myFiles.splice(i-1, 1)); // make sure to use i-1, not i console.log(myFiles); // const obj = Object.assign({}, myFiles ); use this to return it back to an obj } function removeAll(){ document.getElementById("files").value=null; } <input id="files" type="file" multiple="multiple"> <button onclick="remove(1)">delete 1st</button> <button onclick="remove(2)">delete 2nd</button> <button onclick="remove(3)">delete 3rd</button> <button onclick="removeAll()">delete all</button>Primero, debe distribuir input.files en una matriz.
En segundo lugar, debe llamar a splice() en la matriz con el índice "i" ( remove(i) ) como primer argumento y al final: especifica que desea eliminar solo 1 elemento con el segundo argumento: arr.splice(i, 1) .
Finalmente, arr ha eliminado el elemento de acuerdo con el clic del botón.
Además, debe iniciar sus botones desde `remove(0)' porque las matrices comienzan en 0.
function remove(i){ //document.getElementById('files').files.splice(i, 1); const input = document.getElementById('files') const arr = [...input.files]; arr.splice(i, 1); console.log(arr); } function removeAll(){ document.getElementById("files").value=null; } <input id="files" type="file" multiple="multiple"> <button onclick="remove(0)">delete 1st</button> <button onclick="remove(1)">delete 2nd</button> <button onclick="remove(2)">delete 3rd</button> <button onclick="removeAll()">delete all</button>