Sep 18
Segue um exemÂplo de como adiÂciÂoÂnar o efeito togÂgle (alterÂnar) estado de um eleÂmento (show) ou (hide) dando bind nos eleÂmenÂtos no evento click.
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
</head>
<body>
<div>
<span id="pergunta_1">
<p>antropologia</p>
</span>
<span id="resposta_1">
<p>antropologia</p>
</span>
</div>
<div>
<span id="pergunta_2">
<p>FAQP2</p></span>
<span id="resposta_2">
<p>FAQR2</p>
</span>
</div>
<div>
<span id="pergunta_3">
<p>Atividade Complementar</p>
</span>
<span id="resposta_3">
<p>Atividade Complementar</p>
</span>
</div>
<script type="text/javascript">
// Adicionando background
$("span[@id*=pergunta_]").css('background','silver');
// Adicionando um cursor padrao link
$("span[@id*=pergunta_]").css('cursor','pointer');
// Escondendo elementos
$("span[@id*=resposta_]").hide();
// Adicionando evendo click no elementos span com id que iniciam com
// pergunta_ .
$("span[@id*=pergunta_]").bind("click", function(event) {
// Pegando string apartir da possicao 9.
var id = new String(this.id).substring(9);
// Criando string para pegar a id da resposta_ que pertence a pergunta_ .
var resposta_id = 'resposta_' + id;
// Verifica se existe algo dentro da resposta_id para executar toggle.
if ($('#' + resposta_id).length > 0) {
$('#' + resposta_id).toggle();
return false;
}
});
</script>
</body>
</html>
Caso tenha alguma duvida deixe um comenÂtáÂrio que terei praÂzer em ajuÂdar.
ComenÂtáÂrios são bem vinÂdos assim posso melhoÂrar a quaÂliÂdade dos tutoÂriÂais aqui apresentados.
Comentários Recentes