A la hora de desarrollar web apps resulta fundamental algún metodo eficaz para cargar imágenes en Javascript. Antes de que el usuario entre en una página es necesario que ésta se cargue por completo. Si en tu aplicación web vas a trabajar con imágenes dinámicas, es decir, que se crean en un momento determinado es fundamental que antes realices la carga en memoria.
Éste es el código que utilizo sin usar ningún tipo de librería:
En la función imagenCargada es donde ya sé que la imagen ha sido cargada correctamente y puedo proceder a su utilización ya que está almacenada en memoria.
<html>
<head>
<title>Cargar imagen</title>
<meta charset="utf-8" />
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", inicio, false);
function inicio()
{
var nuevaImagen = new Image();
alert("Se procede a la carga en memoria de la imagen");
nuevaImagen = cargarImagen("ejemplo.png");
}
function cargarImagen(url)
{
var imagen = new Image();
imagen.onload = imagenCargada;
imagen.src = url;
return imagen;
}
function imagenCargada()
{
alert("La imagen se ha cargado correctamente");
}
</script>
</head>
<body>
</body>
</html>
Descarga el código fuente del ejemplo pulsando aquí.
https://www.youtube.com/embed/z-xGk9c_eOw Guionista y locutor: Manuel Ignacio López Quintero.Fecha de publicación: 31 de diciembre de 2024.
Ver comentarios
hola disculpa soy nueva en java script, y quisiera...saber como puedo visualizar las imagenes que he subido a las bases de datos.
Este es el codigo que estoy utilizando, pero en la visualización me sale null en el campo de la imagen..... :(
<%
String consulta = "SELECT LLAVE,FOTO (" + request.getParameter("LLAVE") + ", "+ request.getParameter("FOTO") +")";
//ut.println(consulta);
ResultSet a = null;
//out.println(consulta);
ConectarBDG CPC_IMAGEN = new ConectarBDG();
CPC_IMAGEN.conectar();
a = CPC_IMAGEN.consulta("SELECT LLAVE,FOTO FROM RH.CPC_IMAGEN");
while (a.next()) {
//out.print("");
out.print("" + "" + a.getString(1)+ " ");
out.print("" + a.getString(2)+ " ");
out.print("");
}
%>
@disqus_Ptm9W5wxVs:disqus, desde JS no podés hacer eso, ya que es un lenguaje lado cliente, para ello podés optar por PHP, del mismo hacer la peticion a la BD; y sí deseas traer esa img a cierta parte del DOM vía JS, es cuestion de hacer con PHP la peticion al SERV->BD y con AJAX traer la imagen !!! SUERTE!!!