jQuery - ¿Cómo puedo vincular eventos a elementos ocultos que se mostrarán más adelante?

Estoy tratando de adjuntar eventos de "clic" a todos los elementos de una clase en particular. El problema es que algunos de los elementos están en una pestaña que está oculta (mostrar: ninguno) en el momento en que el evento está vinculado. (.enlazar()). Parece que cuando se muestran estos elementos, los eventos ya no están vinculados.jQuery - ¿Cómo puedo vincular eventos a elementos ocultos que se mostrarán más adelante?

$('a.someClass').bind('click', function(){ 
    alert("test"); 
});

Los elementos ocultos no parecen tener un evento de clic enlazado. Si selecciono los elementos ocultos:

$('a.someClass:hidden').bind('click', function(){ 
    alert("test"); 
});

parece que el evento click no está obligada cuando estos elementos ya no se ocultan. Alguien ha experimentado esto? ¿Hay alguna manera de vincular y suponer eventos a elementos independientemente de su propiedad de visualización?

Gracias

Fuente

2011-04-13 Nick

prueba de su selector para asegurarse de que es la selección de los elementos ocultos elementos que son pantalla:. ninguno todavía puede tener eventos vinculados a ellos. Pruebe $ ('a.someClass: hidden'). length y vea qué devuelve para probar si su selector es correcto. – derek

'independientemente' o 'independientemente'. Nunca 'no obstante';) – osullic

edición 2 años más tarde: Como algunas personas señalaron, la función Live ahora es obsoleto (como también se puede ver en la parte superior de la página documentos vinculados). El nombre del controlador de eventos correcto para la versión actual sería On. Vea la respuesta de Maxim como un buen ejemplo.

Respuesta original:
¿Ha intentado utilizar Live()?

.live('click',function(){/* code */});

_{versión nota: live ha quedado obsoleto en jQuery 1.7 y se eliminó en jQuery 1.9. Esta respuesta es correcta sólo para las versiones de jQuery mayores de jQuery 1.7}

Fuente

2011-04-13 21:03:06 Damb

+1 Yo tengo d el mismo pensamiento –

Dulce. ¡¡Gracias!! – Nick

.live ahora está obsoleto use .on o .delegate api.jquery.com/live – JudgeProphet

De acuerdo con la documentación de jQuery en http://api.jquery.com/live/

Adjuntar un controlador al evento para todos los elementos que coinciden con el selector de corriente, ahora y en el futuro

Aquí es un ejemplo de cómo usarlo:

<!DOCTYPE html> 
<html> 
<head> 
    <style> 
    p { background:yellow; font-weight:bold; cursor:pointer; 
      padding:5px; } 
    p.over { background: #ccc; } 
    span { color:red; } 
    </style> 
    <script src="http://code.jquery.com/jquery-1.5.js"></script> 
</head> 
<body> 
    <p>Click me!</p> 

    <span></span> 
<script> 
    $("p").live("click", function(){ 
     $(this).after("<p>Another paragraph!</p>"); 
    }); 
</script> 

</body> 
</html>

Fuente

2011-04-13 21:07:14

Uso delegado (tenga en cuenta que esto es después de que les mostrar):

$('body').delegate('.someClass', 'click', function (evt) { 
    // do something here 
});

Fuente

2011-04-13 21:08:14 forthehackofit

A partir de jQuery 1.7, es obsoleto el método .live().

Ahora puede usar el método .on(). Al adjuntar un evento delegado a un elemento que se puede ver en el HTML cuando se ejecuta jQuery.

Así que si a.someClass se oculta cuando se ejecuta jQuery, se debe adjuntar un evento delegado en el cuerpo, por lo que se ejecuta cuando hay un a.someClass elemento visible en el futuro, por ejemplo:

$('body').on('click','input.a.someClass',function(){ 
    alert("test"); 
});

Fuente

2012-06-15 12:14:08

Digamos que llama a una plantilla que muestra un bloque HTML en la página que inicialmente está oculta, y ese bloque presenta algunos javascript en línea (para sí mismo), el código anterior no se activa, ya que está dentro de ese elemento oculto. ¿Hay alguna solución para que el javascript en línea también se active? – basZero

tiempos han cambiado, ahora se haría usando ".en"

.on('click',function(){/* code */});

Fuente

2013-06-20 21:47:52

¿Por qué repite [la respuesta de Maxim McNair] (http://stackoverflow.com/a/11050439/499214)? –

En ese momento Maxim estaba usando '.live()' en lugar de '.on()'. Verifique los registros de cambios. –

Entendido, gracias. Es posible que desee eliminar su respuesta ahora que duplica otra. –

Uso

$('parentelement').on('click','taget element',function(){ 

})

parentelement debe ser visible en la página de carga

Fuente

2016-09-21 05:01:02 Vipin

jQuery - ¿Cómo puedo vincular eventos a elementos ocultos que se mostrarán más adelante?

Respuesta

Cuestiones relacionadas