Ola galera bom dia!
enconteri esse script q da certinho no q estou precisando mas ele roda perfeitamente do jeito q eu encontrei, mas qnd eu faço as alterações no q eu preciso ele naun roda !
Alguem pode me ajudar ?
esse é o codigo q peguei na net roda certinho !
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
function id(el) {
return document.getElementById(el);
}
function mostra(element) {
if (element.value) {
id(element.value).style.display = 'block';
}
}
function esconde_todos($element, tagName) {
var $elements = $element.getElementsByTagName(tagName),
i = $elements.length;
while(i--) {
$elements[i].style.display = 'none';
}
}
window.addEventListener('load', function() {
var $Masculino = id('Masculino'),
$Feminino = id('Feminino'),
$sexo = id('sel-sexo');
//mostrando no onload da página
esconde_todos(id('palco'), 'div');
mostra($sexo);
//mostrando ao mudar o select
$sexo.addEventListener('change', function() {
esconde_todos(id('palco'), 'div');
mostra(this);
});
});
</script>
</head>
<body>
<select name="sel-sexo" id="sel-sexo">
<option value="">--</option>
<option value="Feminino">Feminino</option>
<option value="Masculino">Masculino</option>
</select>
<div id="palco">
<div id="Masculino">Seu sexo é Masculino!</div>
<div id="Feminino">Seu sexo é Feminino!</div>
</div>
</body>
</html>
Esse é o codigo q eu alterei, e naun roda !
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
function id(el) {
return document.getElementById(el);
}
function mostra(element) {
if (element.value) {
id(element.value).style.display = 'block';
}
}
function esconde_todos($element, tagName) {
var $elements = $element.getElementsByTagName(tagName),
i = $elements.length;
while(i--) {
$elements[i].style.display = 'none';
}
}
window.addEventListener('load', function() {
var $Paz = id('Paz'),
$Fan = id('Fan'),
$Ran = id('Ran'),
$Fam = id('Fam'),
$Soc = id('Soc'),
$Mul = id('Mul'),
$Pat = id('Pat'),
$Ped = id('Ped'),
$Nik = id('Nik'),
$Oli = id('Oli'),
$Lar = id('Lar'),
$sexo = id('sel-sexo');
//mostrando no onload da página
esconde_todos(id('palco'), 'div');
mostra($sexo);
//mostrando ao mudar o select
$sexo.addEventListener('change', function() {
esconde_todos(id('palco'), 'div');
mostra(this);
});
});
</script>
</head>
<body>
<select name="sel-sexo" id="sel-sexo">
<option selected="selected">Escolha um clube</option>
<option value="Paz">PAZ FC</option>
<option value="Fan">FANTASTIC PAZ</option>
<option value="Ran">RANCHÃO</option>
<option value="Fam">FAMÍLIA UNIDA</option>
<option value="Soc">SOCCER</option>
<option value="Mul">MULEKS DA DIRCE</option>
<option value="Pat">PATRIMÔNIO FC</option>
<option value="Ped">PEDREIRA FC</option>
<option value="Nik">NIKE 10</option>
<option value="Oli">OLIMPUS</option>
<option value="Lar">LARANJA MECÂNICA FC</option>
</select>
<div id="palco">
<div id="Paz"><img src="../../IMAGENS/BRASAO_PAZ.PNG" alt="" width="50" height="50" /></div>
<div id="Fan"><img src="../../IMAGENS/BRASAO_FANTASTIC.PNG" alt="" width="50" height="50" /></div>
<div id="Ran"><img src="../../IMAGENS/BRASAO_RANCHAO.PNG" alt="" width="50" height="50" /></div>
<div id="Fam"><img src="../../IMAGENS/BRASAO_FAMILIA.PNG" alt="" width="50" height="50" /></div>
<div id="Soc"><img src="../../IMAGENS/BRASAO_SOCCER.PNG" alt="" width="50" height="50" /></div>
<div id="Mul"><img src="../../IMAGENS/BRASAO_MULEKS.PNG" alt="" width="50" height="50" /></div>
<div id="Pat"><img src="../../IMAGENS/BRASAO_PATRIMONIO.PNG" alt="" width="50" height="50" /></div>
<div id="Ped"><img src="../../IMAGENS/BRASAO_PEDREIRA.PNG" alt="" width="50" height="50" /></div>
<div id="Nik"><img src="../../IMAGENS/BRASAO_NIKE10.PNG" alt="" width="50" height="50" /></div>
<div id="Oli"><img src="../../IMAGENS/BRASAO_OLIMPUS.PNG" alt="" width="50" height="50" /></div>
<div id="Lar"><img src="../../IMAGENS/BRASAO_LARANJA.PNG" alt="" width="50" height="50" /></div>
</div>
</body>
</html>