Skip to content

Instantly share code, notes, and snippets.

@crystianwendel

crystianwendel/pagina4.html

Created October 18, 2013 13:10
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save crystianwendel/7041315 to your computer and use it in GitHub Desktop.
Save crystianwendel/7041315 to your computer and use it in GitHub Desktop.
Download ZIP
Formulário inteligente, que exibe ou esconde conteúdo baseado num check
Raw
pagina4.html
<html>
<head>
<meta charset="UTF-8">
<title>Titulo</title>
<link rel="stylesheet" type="text/css" href="estilo.css"/>
<style rel="stylesheet" type="text/css">
.hidden {
display: none;
}
</style>
</head>
<body>
<form action="http://www.headfirstlabs.com/contest.php" method="POST"
onsubmit="return valida();">
<p>Primeiro nome: <input id="firstname" type="text" name="firstname"/></p>
<p>Último nome: <input id="lastname" type="text" name="lastname"/></p>
<p>Endereço: <input type="checkbox" name="enviar_endereco"
onchange="mostra_esconde();" id="check"/>
</p>
<div id="div_escondida" class="hidden">
<p>Endereço: <input id="address" type="text" name="lastname"/></p>
<p>Email: <input id="email" type="text" name="lastname"/></p>
</div>
<p>
<input type="submit" value="Enviar"/>
</p>
</form>
<script language="javascript">
function mostra_esconde() {
check = document.getElementById('check');
div_escondida = document.getElementById('div_escondida');
if (check.checked == true) {
div_escondida.className = "";
} else {
div_escondida.className = "hidden";
}
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment