[RESOLVIDO] Dúvida jQuery - alternar valor

2 de julho de 2012 3 respostas

hudson5 2 de julho de 2012

Estou com uma dúvida num código:

Um “show details” / “hide details”

Na primeira vez que clica, ele ta mudando o valor, só a partir da segunda:

O valor ta como "show"

Valor = show

Valor = hide

$("button#id").click(function() {
			if($("button#id").html()=="show details") {
				$("button#id").html("hide details")
			}else {
				$("button#id").html("show details")
			};

			$("#div").slideToggle(400);
			
		});

Valeu!

3 Respostas

windsofhell 3 de jul. de 2012

Eu nao entendi direito a sua duvida.

Mas pelo que eu entendi do seu codigo, vc quer:

clicar no botao, mostrar o div e mudar o label do botao para “hide details”.
clicar no botao novamente, se o div estiver visible, esconde o div e mudar o label do botao para “show details”.

Eh isso???

Voce poderia escrever esse codigo um pouco melhor, dessa forma:

HTML:

<button id="details"/>Show details</button>
<div id="divdetails" style="display:none">
    Details div!!!<br>
    Details div!!!<br>
    Details div!!!<br>
    Details div!!!<br>
</div>

Javascript:

$("#details").click(function() {
    var isShowingDetails = $("#divdetails").is(":visible");
    var buttonlabel = (isShowingDetails ? "Show details" : "Hide details");
    $(this).html(buttonlabel);
    $("#divdetails").slideToggle(400);
});&#8203;

Eu nao gosto muito essas comparacoes de string igual vc fez no seu codigo e fazendo dessa forma o codigo fica mais limpo e facil de entender.

eu verifico se o div com os detalhes esta visible ou nao.
defino o label do botao dependendo da variavel isShowingDetails.
modifico o label do botao e mostrou ou escondo o div.

Aqui tem o codigo funcionando se vc quiser testar: http://jsfiddle.net/windsofhell/s6C95/2/

//Daniel

hudson5 3 de jul. de 2012

Obrigao Daniel, era isso mesmo.

São meus primeiros contatos com jQuery/Javascript, deve ser por isso que o codigo tava sujo

Resolvido ;D

windsofhell 3 de jul. de 2012

hudson5:
Obrigao Daniel, era isso mesmo.

São meus primeiros contatos com jQuery/Javascript, deve ser por isso que o codigo tava sujo

Resolvido ;D

Legal! Fico feliz em ter ajudado. Eu tambem estou aprendendo JQuery.

Edita o titulo do seu topico e adiciona [RESOLVIDO] na frente, sem apagar o titulo original.

//Daniel

Criado 2 de julho de 2012

Ultima resposta 3 de jul. de 2012

Respostas 3

Participantes 2

3 Respostas

Topicos relacionados