Método de evento jQuery - toggle()

Manual de referencias de eventos jQuery

Ejemplo

Cambiar diferentes colores de fondo:

$("p").toggle();
  function(){
  $("body").css("background-color","green");
  function(){
  $("body").css("background-color","red");},
  function(){
  $("body").css("background-color","yellow");}
);

Prueba personalmente

Definición y uso

El método toggle() se utiliza para enlazar dos o más funciones de manejador de eventos, para responder a eventos de clic rotativos en elementos seleccionados.

Este método también se puede usar para cambiar el hide() Con show() Método.

Enlazar dos o más funciones al evento Toggle

Cambia entre dos o más funciones cuando se hace clic en el elemento especificado.

Si se especifican dos o más funciones, toggle() cambiará todas las funciones. Por ejemplo, si hay tres funciones, el primer clic llamará a la primera función, el segundo clic a la segunda función, el tercer clic a la tercera función. El cuarto clic volverá a llamar a la primera función, y así sucesivamente.

Sintaxis

$(selector).toggle(function1(),function2(),functionN(),...)

Prueba personalmente

Parámetros Descripción
function1() Obligatorio. Función que se ejecuta cuando el elemento se hace clic por segunda vez.
function2() Obligatorio. Función que se ejecuta cuando el elemento se hace clic por primera vez.
functionN(),... Opcional. Especifica otras funciones que se deben cambiar.

Cambiar Hide() y Show()

Revisa si cada elemento es visible.

Si el elemento ya está oculto, ejecuta show(). Si el elemento es visible, oculta el elemento. De esta manera, se puede crear un efecto de cambio.

Sintaxis

$(selector).toggle(speed,callback)

Prueba personalmente

Parámetros Descripción
speed

Opcional. Especifica la velocidad del efecto de ocultar/mostrar. El valor predeterminado es "0".

Valores posibles:

  • milisegundos (por ejemplo, 1500)
  • "slow"
  • "normal"
  • "fast"
callback

Opcional. Función que se ejecuta cuando toggle() se completa.

Para obtener más información sobre callback, visite nuestra Tutoriales de funciones de callback.

Mostrar u ocultar elementos

Especifica si solo se deben mostrar u ocultar todos los elementos coincidentes.

Sintaxis

$(selector).toggle(switch)

Prueba personalmente

Parámetros Descripción
switch

Obligatorio. Valor booleano que especifica si toggle() debe mostrar o ocultar solo todos los elementos seleccionados.

  • true - Mostrar elementos
  • false - Ocultar elementos

Manual de referencias de eventos jQuery