0

Tengo varios < span > que creo de manera dinamica con id unicos de la siguiente manera:

<span class="zoom" id="ex'+$contador+'">

por lo que finalmente consigo span con id= ex1, ex2, ex3, ex4 ...etc. esto me funciona bien.

Tambien en mis scripts, tengo un .each y es ahi donde creo mis div de manera dinamica en este punto cuando creo un span, y le agrego un evento. evento.zoom()

de esta manera:

<span class="zoom" id="ex'+$contador+'">
    $('#ex1').zoom();

por cada span yo agrego una imagen para obtener el efecto de zoom. las imagenes se ven bien.

si agrego por cada imagen de forma manual, el evento zoom funciona bien.

 $('#ex1').zoom();
 $('#ex2').zoom();
 $('#ex3').zoom();
 $('#ex4').zoom();

El efecto funciona bien si agrego el #ex1, 2, 3, de forma manual, el problema es que no se cuantos div se vayan a crear de manera dinamica.

asi que en el .each intenté crear los eventos de forma dinamica de esta manera, pero ninguno me funciona:

let zoom="ex"+contador;
$(zoom).zoom();     // NO ME FUNCIONA

 $('#ex'+contador).zoom();  // NO ME FUNCIONA

creo yo que tengo un problema de concatenacion, pero no he podido solucionarlo. como puedo hacer una correcta concatenacion, de manera dinamica? Gracias.

2
  • 1
    ¿Por qué usas ID en vez de clase? $('.zoom').zoom();. Por supuesto, también se puede con ID, especificando que el selector comienza con ex, por ejemplo: $('[id^="ex"]').zoom();
    – Triby
    Commented el 21 abr. 2021 a las 18:06
  • ya lo habia intentando con clase $('.zoom').zoom(); pero por alguna razon no me funcionaba... ahora lo he hecho desde una nueva ubicacion. es decir despues de que tooodo el .each terminara y por ultimo le agrego el evento y ahora si funciona, gracias a esta insistencia decidí volver a intentarlo y esta vez si funcionó, muchas gracias.
    – wil
    Commented el 21 abr. 2021 a las 18:32

1 respuesta 1

2

Hola creo que te estas complicando un poco el agregar el evento, puedes intentar de estas dos formas:

con el id puedes multiseleccionar a todos con una misma linea tal que asi:

$('#ex1, #ex2, #ex3').zoom();

o para mi seria mucho mas simple si lo haces con clases, a tus etiquetas span ponles la misma clase tal que asi:

<span class="zoom"></span>

y posteriormente con jquery podrias hacer esto:

$('.zoom').zoom();

Espero te sirva! :)

1
  • ya lo habia intentando con clase $('.zoom').zoom(); pero por alguna razon no me funcionaba... ahora lo he hecho desde una nueva ubicacion. es decir despues de que tooodo el .each terminara y por ultimo le agrego el evento y ahora si funciona, gracias a esta insistencia decidí volver a intentarlo y esta vez si funcionó, muchas gracias.
    – wil
    Commented el 21 abr. 2021 a las 18:33

Tu Respuesta

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

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