2

Tengo un código PHP a través del cual obtengo una serie de imágenes guardadas en mi BBDD.

 $instruccion2= "SELECT * FROM producto";
 $consulta2=mysqli_query($conexion, $instruccion2) or die("No pudo realizarse la consulta2"); 
 while($filas2=mysqli_fetch_array($consulta2)){
    echo "<img src='".$nombreDirectorio.$filas2[4]."' onClick='ventanaModal()'>"; //RUTA DE LA FOTO
 }

Necesito que al hacer "onClick" en cada una de las imágenes se llame a una función de javascript para poder abrir una ventana modal dónde se muestre la imagen dónde hice "onClick".

<script>
   function ventanaModal(){
      var value = document.getElementById("miImagen").src;
      document.write("<img src='"+value+"'>");   
   }
</script>

Cómo veis en el código, en la funcion de JS hay una variable llamada value dónde se guarda la src de la imagen. El tema es que da igual la imagen sobre la que haga "onClick", siempre recoje la src de la primera imagen de la BBDD. ¿Habría alguna forma de arreglar ésto?

1 respuesta 1

3

Al utilizar getElementById estás obteniendo básicamente un único elemento (en teoría) existente, por lo cual si tienes más de un elemento con dicho id (lo cual es incorrecto), siempre tomará el primero.

Puedes utilizar el objeto event, en el cual puedes utilizar su propiedad target, la cual equivale al elemento que generó el evento (en este caso la imagen), y obtener su atributo src:

function ventanaModal(event){
      var value = event.target.src
      document.write("<img src='"+value+"'>")
   }
<img src="http://lorempixel.com/output/nightlife-q-c-200-100-1.jpg" onclick='ventanaModal(event)' />
<img src="http://lorempixel.com/output/nature-q-c-200-200-2.jpg" onclick='ventanaModal(event)' />
<img src="http://lorempixel.com/output/city-h-c-200-300-5.jpg" onclick='ventanaModal(event)' />

2
  • Ole ahí, desconocía el objeto event, mil gracias. Una última pregunta, si hubiera querido pasar el valor a través de parámetros, tendría que haber tirado de Ajax o no hubiera sido necesario en este caso?
    – Inca
    el 20 mar. 2018 a las 23:37
  • 1
    No sé a qué te refieres con "a través de parámetros". Por cierto, si la respuesta te sirvió, puedes marcarla como aceptada.
    – Shaz
    el 20 mar. 2018 a las 23:44

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.