input type=file
Publicado por Marta (39 intervenciones) el 06/01/2021 20:45:45
Buenas, tengo un botón para insertar una imagen y otro para borrarla, si hace falta.
Cada vez que se quiera cargar una imagen, se crea una capa con los elementos necesarios. No tengo ningún problema en ir insertando tantas imágenes como deseo.
Si borro una imagen y cargo otra, tampoco tengo ningún problema.
El problema está cuando borro una imagen y quiero volver a cargar la misma, que no se visualiza
A continuación el código con el que tengo problema. Este código se genera dinámicamente, es decir, según las acciones de los usuarios, creo unos elements u otros.
Quizás es un poco difícil entender el problema. De todas maneras, muchas gracias
Cada vez que se quiera cargar una imagen, se crea una capa con los elementos necesarios. No tengo ningún problema en ir insertando tantas imágenes como deseo.
Si borro una imagen y cargo otra, tampoco tengo ningún problema.
El problema está cuando borro una imagen y quiero volver a cargar la misma, que no se visualiza
A continuación el código con el que tengo problema. Este código se genera dinámicamente, es decir, según las acciones de los usuarios, creo unos elements u otros.
Quizás es un poco difícil entender el problema. De todas maneras, muchas gracias
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
<div style="margin-top:25px;">
<label for="1">
<img src="insertaImatge.png">
</label>
<input type="file" accept="image/*" class="fotos" id="1" onchange="visFoto(1,this);" style="display:none" ;="">
<img style="margin-left:20px" src="esborraImatge.png" onclick="esborraFoto(1)"></div>// se crea la capa, después de la capa indicada por el parámetro id y se visualiza la fotofunction visFoto(id, input) { index++; if ($("#maquina").val() == "") { alert ("PRIMER DE TOT HAS D'INDICAR LA MÀQUINA !!!"); return; } var url = document.getElementById(id).files[0].name; var ext = url.substring(url.lastIndexOf('.') + 1).toLowerCase(); if (input.files && input.files[0]&& (ext == "gif" || ext == "png" || ext == "jpeg" || ext == "jpg")) { var reader = new FileReader(); var aNewNode = document.createElement('div'); aNewNode.id = "divFoto" + index; nodeToActOn = document.getElementById('divFoto' + id); indexStr = index.toString(); reader.onload = function (e) { aNewNode.innerHTML = "<img id='imatge"+indexStr+"' width=400px src='"+ e.target.result +"'>" + "<div style='height:5px'></div> " + "<label for='"+indexStr+"'><img src='insertaImatge.png'></label>" +"<input type='file' accept='image/*' class='fotos' id='"+indexStr+"' onchange='visFoto("+indexStr+",this);' style='display:none'/>" +
"<img style='margin-top:25px;margin-left:20px' src='esborraImatge.png' onclick='esborraFoto("+indexStr+")'> " + "<img style='margin-top:25px;margin-left:20px' src='insertaTexte.png' onclick='afegirText("+indexStr+")'>" + "</div>"; nodeToActOn.after(aNewNode); $('#divFoto'+indexStr).show(); // és necessari per si en algun moment he esborrat una foto i estava en aquesta capa } reader.readAsDataURL(input.files[0]); pujaFoto(id, indexStr); // subo la foto al servidor }}// función cuando se quiere borrar la foto, hago invisible la capa e intento vaciar el input filefunction esborraFoto(id) { idE = seguentCapa(id); // esta función devuelve el id de la capa a borrar $("#"+idE).val(""); $('#divFoto'+idE).remove();}Valora esta pregunta
0