Foro de elhacker.NET

Foro de elhacker.net

Programación

Desarrollo Web (Moderador: #!drvy)

Problema con evento en jQuery - Agregar y quitar clases a la misma vez

0 Usuarios y 1 Visitante están viendo este tema.

Páginas: [1]

Autor

Tema: Problema con evento en jQuery - Agregar y quitar clases a la misma vez (Leído 2,721 veces)

Ali Baba

Desconectado

Mensajes: 310

Problema con evento en jQuery - Agregar y quitar clases a la misma vez

« en: 4 Octubre 2017, 04:07 am »

Tengo este codigo:

Código

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title></title>
 
<style>
	.rojo{
		background-color: red;
		color:white;
	}
</style>
</head>
<body>
	<h1>addClass con jQuery</h1>
 
	<script src="jquery-3.2.1.min.js"></script>
	<script>
 
		$(function(){
			console.log("jQuery funciona");
			$('h1').click(function(){
				$(this).addClass('rojo');
				console.log("Clase agregada");
			});
		})
 
 
	</script>
</body>
</html>

que lo que hace es agregar una clase a la etiqueta h1 y lo hace a la perfeccion. Pero como haria si tuviera que quitarle la clase con removeClass tocando ese mismo elemento del DOM? No se como hacerlo


	En línea

eLank0

eLhAcKeR r00Lz

Desconectado

Mensajes: 1.062

Re: Problema con evento en jQuery - Agregar y quitar clases a la misma vez

« Respuesta #1 en: 4 Octubre 2017, 09:58 am »

Pues exactamente igual, cambiando addClass por removeClass.

Salu2


	En línea

Ali Baba

Desconectado

Mensajes: 310

Re: Problema con evento en jQuery - Agregar y quitar clases a la misma vez

« Respuesta #2 en: 4 Octubre 2017, 16:37 pm »

Cita de: eLank0 en 4 Octubre 2017, 09:58 am

cambiando addClass por removeClass.

Realmente lo que quiero es hacerlo los dos a la misma vez, no cambiando una clase por otra. Lo que quiero es darle clic que se agregue la clase, y cuando le de clic de nuevo que se la quite.


	En línea

cassiani

Desconectado

Mensajes: 978

« Anterior | Próximo »

Re: Problema con evento en jQuery - Agregar y quitar clases a la misma vez

« Respuesta #3 en: 4 Octubre 2017, 18:02 pm »

Usa hasClass para detectar si el elemento tiene la clase agregada y dependiendo de eso, la quitas o la agregas.

Código:

if ( $(this).hasClass('rojo') ) {
$(this).removeClass('rojo');
}else{
$(this).addClass('rojo');
}


	En línea

#!drvy

Moderador

Desconectado

Mensajes: 5.850

Re: Problema con evento en jQuery - Agregar y quitar clases a la misma vez

« Respuesta #4 en: 4 Octubre 2017, 18:08 pm »

Código

$(function(){
    console.log("jQuery funciona");
 
    $('h1').click(function(){
        $(this).toggleClass('rojo');
        console.log("Clase agregada/quitada");
    });
 
});

http://api.jquery.com/toggleclass/

Saludos


« Última modificación: 4 Octubre 2017, 18:09 pm por #!drvy »	En línea

https://www.youtube.com/watch?v=oqKsrSXLR98

Ali Baba

Desconectado

Mensajes: 310

Re: Problema con evento en jQuery - Agregar y quitar clases a la misma vez

« Respuesta #5 en: 4 Octubre 2017, 18:09 pm »

gracias, era eso lo que buscaba, pueden cerrar el tema si quieren


	En línea

Páginas: [1]

Ir a:

Mensajes similares
	Asunto	Iniciado por	Respuestas	Vistas	Último mensaje
	problema para agregar evento "KeyPressed" en una ventana swing java Java	p4nd4criss	2	6,290	4 Junio 2012, 02:29 am por p4nd4criss
	se pueden poner dos jquery en la misma pag Desarrollo Web	cker	3	5,354	2 Septiembre 2012, 19:01 pm por cker
	Problema con evento de Jquery Desarrollo Web	yoelrodguez	0	1,479	24 Enero 2016, 21:12 pm por yoelrodguez
	Problema en jQuery - añadir y quitar clases a la vez Desarrollo Web	Ali Baba	3	3,217	20 Octubre 2017, 22:20 pm por ivancea96
	[Pregunta]: Obtener clases con JQUERY Desarrollo Web	Leguim	2	1,845	28 Febrero 2019, 05:17 am por Leguim