6
He permitido que un usuario cargue una imagen en el almacenamiento local, pero quiero poder tomar esa imagen y llenar un elemento de imagen en la página con ese.Cargando una imagen en localStorage y configurando una imagen src en esa ubicación
<h3>Please upload the image you wish to use.</h3>
<input id="photoin" type="file" accept="image/*;capture=camera"></input>
<a href="#delete_1" data-role="button" onClick="save()">Submit</a>
<script>
var i = 0;
function save(){
var input = document.getElementById("photoin").value;
var name = "photo_" + i;
localStorage.setItem(name, input);
$("#QR").src = window.localStorage[name];
i++;
}
</script>
Busco algo que me dará éxito la dirección URL de la imagen en el almacenamiento, ya que "window.localStorage [nombre]" sólo devuelve el valor emparejado con esa clave.
Gracias!
¿Por qué exactamente quieres hacer eso? ¿El caché del navegador no es suficiente para mantener sus imágenes en la máquina host? – devundef
Quiero que el usuario pueda cambiar el contenido de una página (es decir, quiero que el usuario cargue su imagen, no la mía, y que luego aparezca esa imagen en la página) – NodeNodeNode
¡Lo tengo! Mayge puede convertir la imagen a base64 y luego poner src = "data: image/png; <.. base64 image data ...>". Deberá usar la api del archivo HTML5 para leer el archivo de imagen y luego convertir los datos a base64. Esta publicación lo ayudará en la conversión: http://stackoverflow.com/questions/246801/how-can-you-encode-to-base64-using-javascript#246813 – devundef