Foros del Web » Programando para Internet » Jquery »

Problema con JS al crear divs dinamicamente.

Estas en el tema de Problema con JS al crear divs dinamicamente. en el foro de Jquery en Foros del Web. Buenas, tengo un problema con eventos js, mencionar que uso la libreria jquery. Tengo unas funciones: $("#pixels div div").click(function(event) { // Código X, por ejemplo: ...
  #1 (permalink)  
Antiguo 14/08/2012, 15:21
 
Fecha de Ingreso: febrero-2011
Mensajes: 1
Antigüedad: 13 años, 2 meses
Puntos: 0
Exclamación Problema con JS al crear divs dinamicamente.

Buenas,

tengo un problema con eventos js, mencionar que uso la libreria jquery.

Tengo unas funciones:

$("#pixels div div").click(function(event) {

// Código X, por ejemplo:
// $(this).removeClass("normal_pixel");
// $(this).addClass("select_pixel");
});

El "Codigo X" funciona bien cuando carga la página, pero cuando modifico el numero de divs que hay en los divs "#pixels div" con otra función:

$("#controllers div select").change(function () {

// Segun una lista cambio el numero de divs, con, por ejemplo:
// Los divs de "#pixels div div" tienen este formato, de id='pixel_"+i+"_"+j+"'
// Las vars i y j existen bien y no duplican "ids"
// $("#fila_"+i).append("<div id='pixel_"+i+"_"+j+"' class='normal_pixel'></div>");
}

Aclarar que las funciones no dan error con firebug, la primera función funciona bien, y la segunda función crea los nuevos divs en el sitio que toca.
Y esas funciones estan en:
$(document).ready(function(){ });

Entonces el problema es que los "divs" que ya existían les sigue funcionando las función con el código "Código X" pero los que se crean nuevos, no, alguna idea donde puede haber el conflicto? Puede ser que al generar los divs mediante js con la función, los nuevos divs no les afecte la primera función? Solución?

Espero que se haya entendido bien.


Muchas gracias a todos.


// EDIT:

Si cuando creo los nuevos divs les agrego " onClick='select_pixel(pixel_"+i+"_"+j+")' ";

Y hago una función:

function select_pixel(id){ // Código X
}

Entonces funciona perfecto, pero, alguna solución para evitar esto de tener que poner el "onClick" y que funcione el código sin tener que recurrir a hacer esto?

Última edición por Catalunya69; 14/08/2012 a las 15:34
  #2 (permalink)  
Antiguo 14/08/2012, 23:58
Avatar de dontexplain  
Fecha de Ingreso: junio-2012
Mensajes: 536
Antigüedad: 11 años, 10 meses
Puntos: 127
Respuesta: Problema con JS al crear divs dinamicamente.

Los eventos que se insertan en el interior de un evento ready de documento se aplican a los elementos que existen en el documento cuando este terminó de cargarse. Eso significa que los nuevos elementos introducidos en el DOM no tendrán ningún listener de evento.

Para ello existe

$(elemento).live

agrega dentro de ready

$("#pixels div div").live('click',function(){
// código
})

Un saludo,
__________________
21añero.
HTML/CSS, PHP, JS/jQuery, Mysql; NodeJS/Socket.io (& V8); C++ ; Python (wxpy); Ensamblador.
Músico (clarinetista/pianista) y compositor
  #3 (permalink)  
Antiguo 15/08/2012, 07:21
 
Fecha de Ingreso: agosto-2011
Mensajes: 28
Antigüedad: 12 años, 8 meses
Puntos: 3
Respuesta: Problema con JS al crear divs dinamicamente.

Desde la versión 1.6 de jQuery, la función live ya no esta recomendado, ahora debes usar on y off:

$("#pixels div div").on('click',function(){
// código
})

Etiquetas: dinamicos, divs, js
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 17:47.