Comunidad oficial de diseñadores web, web developers y Webmasters. Aqui podemos tratar temas actuales sobre diseño y tecnología. Podemos compartir y actualizarnos. Photoshop, Flash, PHP, ASP, Java, HTML, CSS, MySQL, CMS, etc. Unite YA y lee los Sticky
Ver más- 13,065 Miembros
- 9,531 Temas
- 3,449 Seguidores
NO EJECUTA JAVASCRIPT AL CARGAR CONTENIDO EN UN DIV CON AJAX
No voy a pegar todo el código de mi html porque es muy extenso:
El problema:
Tengo esto en mi head:
<head>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/kickstart.js"></script><!-- KICKSTART -->
<script type="text/javascript">
$('#milink').click( function() {
$('#cuerpo').empty();
event.preventDefault();
$('#cuerpo').load('paginaquequierocargar.php');
});
</script>
</head>
Tengo esto en mi body:
<body>
<a href="#" id="milink">MI LINK</a>
<div id="cuerpo"> ACA PONGO LO QUE QUIERO CARGAR CON EL MÉTODO LOAD DE AJAX </div>
</body>
EL PROBLEMA ES QUE EL CONTENIDO DE LA PAGINA paginaquequierocargar.php CONTIENE CÓDIGO HTML QUE USA DE LA LIBRERIA js/kickstart.js PERO CUANDO SE CARGA EL CONTENIDO EN LA DIV "CUERPO" ES COMO SINO EJECUTARA LA LIBRERIA EN ESE CÓDIGO HTML QUE CARGO CON AJAX...
ACLARACIÓN: LAS RUTAS ESTÁN BIEN, EN ESO NO HAY ERROR.
ESPERO HABER EXPLICADO BIEN!
DESDE YA GRACIAS!
- 1Calificación
- 1Seguidores
- 348Visitas
- 0Favoritos
Global
Argentina
Chile
Colombia
España
México
Perú
Uruguay
Venezuela
10 respuestas
¿Qué navegador estas usando?
bueno te preguntab alo del navegador por que tienes que estar atento a IE7 al respecto, aunque bueno, es irrelevante, en la web esta pregunta ya la repsondieorn infinidad de veces pero voy a intentar explicar por que sucede.
A la hora de cargar la Página se contruye en el navegador el DOM cuando tu cargas el contenido externo este no existe para terminos practicos, es por eso que sucede lo que sucede.
Ahora ¿que puedes hacer?
Hay mucho contenido en la web al respecto, en google encontre por lo menos 3 soluciones dentro de los primeros resultados.
Si tienes más preguntas acá andamos.
Suerte!
<script type="text/javascript">
$(document).ready( function() {
$('#milink').click( function() {
$('#cuerpo').empty();
event.preventDefault();
$('#cuerpo').load('paginaquequierocargar.php');
});
});
</script>
Falta que metas el código dentro del evento ready de jQuery.
Tal como lo tenías vos, estabas seteandole acciones a #milink cuando este aun no era impreso en el documento, de la manera que te planteo yo, le indicas a jquery que cuando todo el documento se carge, que se ejecute lo que vos queres.
Si...ya lo tenía dentro del ready...sólo que copie la parte del evento porque es largo el archivo.js que tenia...gracias de todas formas!
Estoy usando Chrome... buscaré nuevamente en Google...gracias!
- solución simple (o sea, lo atamos con alambre), incluí kickstart.js dentro del php que cargas.
Exactamente lo primero que hice...pero de esa forma cada vez que le hago click a "MI LINK" se carga nuevamente la librería kickstart.js y con esto se consigue que la librería vuelva a ejecutarse sobre los elementos HTML, haciendo que éstos agranden su tamaño o sus márgenes o paddings...quizás se pueda hacer eso con alguna librería que no se ejecute nuevamente sobre lo elementos, pero no es este el caso...
gracias por reponder!
Voy comentando por si a otro le surge el mismo problema. He buscado por todos lados en Google y di con que tengo que usar el método live() de JQuery. Este método está en desuso, a partir de la versión 1.7 de JQuery se utiliza otro método llamado on(). Básicamente lo que hacen estos métodos es asignar eventos (por ejemplo el evento click) a elementos que todavía no están cargados en la página (por ejemplo un botón), es decir que se van a cargar en un futuro mediante AJAX. Si buscan en la documentación de JQuery hay ejemplos y descripción de los mismos.
Ahora bien...¿esto resuelve mi problema? No.
Voy a dejar un link a la página de la librería kickstart.js por si alguien tiene problemas al igual que yo con esta librería:
http://www.99lime.com/
Esta librería te ayuda a desarrollar tu página haciendo que te ahorres horas de desarrollo...incluye botones, tablas, iconos, menús, etc etc...
Sería muy útil encontrar una solución para este problema con AJAX.
Sigo buscando una solución.
Saludos!
.on de jquery (a partir de jquery 1.7)
Bueno finalmente decidí hacer lo siguiente:

, lo que implica que la librería no se ejecutará sobre elementos HTML que agregue en un futuro (con AJAX), decidí ejecutar los métodos de la librería que me sean necesarios al regresar de la consulta con AJAX, sobre los elementos HTML que cargué de dicha consulta.
Viendo que la librería se ejecuta sólo la primera vez que se carga la página (por el método "$(document).ready()" del archivo "kickstart.js"
Gracias a todos por repsonder!
Saludos!