Problema básico con jquery

Narachamus · #1 (**permalink**) 14/09/2013, 07:27

Buenas chicos, ya es la segunda vez que tengo este fallo, y podría multiplicarse a infinitos, porque es muy básico.
Cuando cargo algún html/php en una capa a través de jquery (load,post,get, lo que sea), y ese algo tiene a su vez una llamada a jquery, no funciona.

Un ejemplo claro, reducido y resumido:

index.html

Código HTML:

Ver original<html>
<head>
    <script type='text/javascript' src='js/jquery-1.9.1.js'></script>
    <script type='text/javascript' src='js/mi-jquery.js'></script>
</head>
<body>
    <div id='capa'>
        <a href='#' id='boton'>Haz click</a>
    </div>
</body>
</html>

mi-jquery.js

Código Javascript:

Ver original$(function(){
   $('#boton').click(function(e){
      $('#capa').load('prueba.html');
      window.alert ("has hecho click");
   });
});

prueba.html

Código HTML:

Ver original<a href='#' id='boton'>Haz click otra vez</a>

El primer click funciona, el segundo del nuevo enlace ya no.

Saludos!

Edito: cargando otra vez los scripts de jquery y mi-jquery en prueba.html funciona, pero no se puede hacer sin cargarlos? Se supone que ya está en index.html, no?

PHPeros · #2 (**permalink**) 14/09/2013, 07:40

Hola.
No puedes usar la función load() para este caso, porque borrarías todo el innerHTML, osea el contenido del div. Debes crear uno aparte y no tendrías que duplicar, redirigir, o incluir nada más. En cuanto al importe de jquery solo lo puedes usar en el documento actual, puedes cargar más recursos pero solo podrás hacer scripting con la api API desde el documento padre.
Saludos!

Narachamus · #3 (**permalink**) 14/09/2013, 09:14

¿Podrías explicarlo con ejemplos, por favor? Estoy un poco pez en jquery aún, te lo agradecería mucho

PHPeros · #4 (**permalink**) 14/09/2013, 09:32

Muy resumidamente te digo que es innecesario crear dos links que apunten a la misma función, y eso se puede evitar creando un div aparte y exclusivo donde recibes el texto obtenido de la llamda ajax (sin tener que borrar el anterior link). Saludos!

Narachamus · #5 (**permalink**) 15/09/2013, 11:45

Sí, esa solución serviría para el caso del enlace, que puedes aislarlo en un div aparte. Pero ponte por ejemplo, como es mi caso, que se trata de una galería de imágenes.
Cada imagen se abre en un popup de jquery al hacer click sobre ellas, pero al recargar las imágenes (sea por un paginador de avanzar/retroceder, o por actualizar, borrar, o subir), ese popup ya no funciona. ¿Cómo se haría en este caso para no tener que repetir la carga de los js cada vez que se recargue la galería en el div?