Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Evandro.S Eisinger

Substituir classe - Jquery - Problema

Recommended Posts

Oi Pessoal!

 

Estou com um problema, onde criei uma funçao que troca a classe quando o botao é clicado. Mas nao entendo porque não funciona.

 

Poderiam me auxilhar na resolução desse problema.

 

Codigo:

 

<style type="text/css" media="all">
.inativo
{
	background-color: #CCC; width:80px; height:20px; border:none; color:#333; font-family:Verdana, Geneva, sans-serif;
}
.ativo
{
	background-color: #666; width:80px; height:20px; border:none; color: #000; font-family:Verdana, Geneva, sans-serif;	
}
</style>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
	$(document).ready(function(){
		$("#botao1").click(function () {
			ativa($('#botao1'));
			desativa($('#botao2'));
		});
		$("#botao2").click(function () {
			ativa($('#botao2'));
			desativa($('#botao1'));
		});
		function ativa(botao){
			$(botao).addClass(ativo);
		}
		function desativa(botao){
			$(botao).addClass(inativo);
		}
  });
</script>
</head>
<body>
	<button type="button" id="botao1" class="ativo">Botão 1</button>
	<button type="button" id="botao2" class="inativo">Botão 2</button>
</body>

Obrigado!

 

Evandro.S Eisinger

Compartilhar este post


Link para o post
Compartilhar em outros sites

nao sei se é o melhor jeito.. mais testa ae..

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>

<style type="text/css" media="all">
.inativo
{
	background-color: #CCC; width:80px; height:20px; border:none; color:#333; font-family:Verdana, Geneva, sans-serif;
}
.ativo
{
	background-color: #666; width:80px; height:20px; border:none; color: #000; font-family:Verdana, Geneva, sans-serif;	
}

</style>
<script type="text/javascript" src="../portal_operacional_modelo/includes/js/jquery.js"></script>
<script type="text/javascript">
	$(document).ready(function(){
		$("button").click(function () {
			ativa($("#botao1"));
			desativa($("#botao2"));
		});
		
		$("#botao2").click(function () {
			ativa($("#botao2"));
			desativa($("#botao1"));
		});
		function ativa(botao){
			$(botao).attr('class','ativo');
		}
		function desativa(botao){
			$(botao).attr('class','inativo');
		}
		
  });
</script>



</head>

<body>

<button type="button" id="botao1" class="ativo">Botão 1</button>
<button type="button" id="botao2" class="inativo">Botão 2</button>

</body>
</html>

Compartilhar este post


Link para o post
Compartilhar em outros sites

nao funcionou? eu testei aki e ta tudo beleza....

 

da uma conferida no local q esta o arquivo jquery.js

 

e fala qual erro esta dando!!

 

flw!! abraço!

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.