Alternar dos divs y clases -- jquery campo con toggle campo con visibility camp Relacionados El problema

Toggle two divs and classes


3
vote

problema

Español

Tengo dos enlaces con clases (formulario de inicio de sesión y formulario de registro) relevantes para su ID de formularios de destino, desean alternar. También tengo una función predefinida 'SlideToggle' para alternar mejor.

Esto es lo que he intentado hasta ahora:

  $('#userbar a').click(function() {       var c = $(this).attr('class');       $('#userbar a').removeClass('active');       $(this).toggleClass('active');       $('#register-form,#login-form').hide(); //bad, causing flashy       $('#' + c).slideToggle('slow');          return false;     });   

Con esto tengo problemas con la ventana llamativa, y para alternar correctamente las clases activas cuando se hace clic en otro enlace, el otro enlace ya no debería tener una clase activa. El problema adicional es que el enlace está muerto en los clics en serie.

Tengo otro intento, más largo:

  $('#userbar a').click(function() {       var c = $(this).attr('class');         switch (c) {         case 'login-form':             $('#' + c).slideToggle('slow');             $(this).toggleClass('active');             $('#register-form').hide();             break;         case 'register-form':             $('#' + c).slideToggle('slow');             $(this).toggleClass('active');             $('#login-form').hide();             break;         }         return false;     });   

Este es peor que el primero :(

¿Alguna sugerencia para corregir el comportamiento?

Lo que quiero es cuando se hace clic en un enlace con el formulario de inicio de sesión de clase, por lo que cambia el formulario con el formulario de inicio de sesión de ID, y ocultar el formulario de registro si está abierto.

Cualquier ayuda sería muy apreciada. Gracias.

Original en ingles

I have two links with classes (login-form and register-form) relevant to their target forms ID, they want to toggle. I have also a predefined 'slideToggle' function to toggle better.

This is what I have tried so far:

$('#userbar a').click(function() {       var c = $(this).attr('class');       $('#userbar a').removeClass('active');       $(this).toggleClass('active');       $('#register-form,#login-form').hide(); //bad, causing flashy       $('#' + c).slideToggle('slow');          return false;     }); 

With this I have trouble with the flashy window, and to correctly toggle the active classes when another link is clicked, the other link should not have active class anymore. Additional problem is the link is dead on serial clicks.

I have another try, longer one:

$('#userbar a').click(function() {       var c = $(this).attr('class');         switch (c) {         case 'login-form':             $('#' + c).slideToggle('slow');             $(this).toggleClass('active');             $('#register-form').hide();             break;         case 'register-form':             $('#' + c).slideToggle('slow');             $(this).toggleClass('active');             $('#login-form').hide();             break;         }         return false;     }); 

This one is worse than the first :(

Any suggestion to correct the behavior?

What I want is when a link with class login-form is click, so toggle the form with ID login-form, and hide the register-form if open.

Any help would be very much appreciated. Thanks.

        
 
 

Lista de respuestas

2
 
vote
vote
La mejor respuesta
 

Intente usar el método .stop() en cualquier elemento que el efecto "SlideToggle" se está ejecutando actualmente antes de alternar la clase o intente ocultarlo, por ejemplo:

  $('#userbar a').click(function() {   var c = $(this).attr('class');   $('#userbar a').stop(); //stop any currently running animations, which might be messing with the "hide()" method below   $('#userbar a').removeClass('active');   $(this).toggleClass('active');   $('#register-form,#login-form').hide(); //bad, causing flashy   $('#' + c).slideToggle('slow');      return false; });   
 

Try using the .stop() method on any elements which the "slideToggle" effect is currently running before you toggle the class or try to hide it, eg:

$('#userbar a').click(function() {   var c = $(this).attr('class');   $('#userbar a').stop(); //stop any currently running animations, which might be messing with the "hide()" method below   $('#userbar a').removeClass('active');   $(this).toggleClass('active');   $('#register-form,#login-form').hide(); //bad, causing flashy   $('#' + c).slideToggle('slow');      return false; }); 
 
 
     
     

Relacionados problema

63  ¿Hay alguna forma de establecer una propiedad estática privada / protegida usando clases de reflexión?  ( Is there any way to set a private protected static property using reflection cla ) 
Estoy tratando de realizar una función de copia de seguridad / restauración para las propiedades estáticas de las clases. Puedo obtener una lista de todas las...

0  Visibilidad del control de usuario  ( Visibility of user control ) 
En mi aplicación obtuvo una barra lateral, que está sosteniendo este componente dos: <Grid x:Name="AF" Visibility="Visibility"> <betata...

124  ¿Cómo puedo verificar si un elemento es realmente visible con JavaScript? [duplicar]  ( How do i check if an element is really visible with javascript ) 
Esta pregunta ya tiene respuestas aquí : Compruebe si el elemento es visible en DOM ...

24  Haz una divisca visible y otra invisible  ( Make one div visible and another invisible ) 
Tengo dos etiquetas DIV, una es para la búsqueda y la otra es para los resultados. Lo que necesito es para cuando se hace clic en el botón Enviar, los resulta...

21  Desactivar o gris fuera un nodo en el editor de Treenode  ( Disable or grey out a node in the treenode editor ) 
¿Cómo deshabilito un nodo específico para que el usuario no pueda seleccionarlo? Ocultarlo para el usuario también es válido. Probé la propiedad visible, pe...

-1  Visibilidad de 2 componentes de usuario en Silverlight  ( Visibility of 2 user component in silverlight ) 
En mi aplicación obtuvo una barra lateral, que está sosteniendo este componente dos: <Grid x:Name="AF" Visibility="Visibility"> <betata...

1  Ocultar texto en palabra (particularmente tablas)  ( Hiding text in word particularly tables ) 
He estado trabajando en un documento que tiene una serie de secciones ocultas que se pueden hacer visibles con las casillas de verificación (y VBA). La mayorí...

1  Quiero mostrar habilitar un botón en primer clic y cuando se haga clic en otro botón, entonces el hecho de clic anteriormente debe estar inactivo  ( I want to show enable a button on first click and when other button is clicked ) 
He establecido imágenes en Dibujable e intenté configurarlos usando OnClickListenerders y Uing View.Visible y View.Gone, pero una vez que se hace clic en el b...

-8  Visibilidad de la clase en Java [CERRADO]  ( Visibility of class in java ) 
Es difícil decir qué se está preguntando aquí. Esta pregunta es ambigua, vaga, incompleta, demasiado amplia, o retórica y n...

1  JQERY: usando Haga clic solo en un elemento único: usando .SlideToggle y .Nextuntil para ocultar y mostrar todo tipo de contenido en el clic de un mouse  ( Jquery using click only on single element using slidetoggle and nextuntil to ) 
HEYS! Cortará el derecho al tema, aquí está el código JQERY: private searchTerms = new Subject<string>(); googleSearchLocations: Observable<GoogleLocatio...




© 2022 respuesta.top Reservados todos los derechos. Centro de preguntas y respuestas reservados todos los derechos