Ir para conteúdo

POWERED BY:

Arquivado

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

rodrigofariat

[Resolvido] Setando valores default para o elemento select do HTM

Por , em Javascript

Recommended Posts

rodrigofariat    0

rodrigofariat
Postado

Pessoal,

 

 

Criei um HTML com dois select fiz as seguinte estrutura:

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
		<title>Usando Select</title>
		<script language="JavaScript">
		document.getElementById("combustivel").options[2] = 'alcool';
		document.getElementById("carros").options[2] =  'Parati';
		</script>
	</head>
	<body>
	
          <SELECT name="combustivel" id="combustivel">
          <OPTION>diesel</OPTION>
          <OPTION>gasolina</OPTION>
          <OPTION>alcool</OPTION>
          </SELECT>
          
          <SELECT name="carros" id ="carros">
          <OPTION>Uno Mille</OPTION>
          <OPTION>Passat</OPTION>
          <OPTION>Parati</OPTION>
          </SELECT>		
	</body>
</html>

Quando o HTML é renderizado para o id combustivel o item diesel é o primeiro a ser visto pelo usuário.

Quando o HTML é renderizado para o id carros o item Uno Mille é o primeiro a ser visto pelo usuário.

 

Estou tentando fazer que o select id chamado combustível, tenha o terceiro elemento visível, ou seja o primeiro

da lista do select. Isso vale para o segundo select também.

 

Alguns erros reportados do firebug

 

document.getElementById("combustivel") is null
file:///home/rodrigo/Untitled%20HTML%202.html
Line 7

Testei vários comandos utilizando o getElementById, nas nenhum deles funcionou

 

Alguem tem ideía de onde possa estar o erro ?

 

Att,

 

Rodrigo Faria

Compartilhar este post

Link para o post
Compartilhar em outros sites

iRCC    0

iRCC
Postado

o erro acontece cara pq o js é executado antes de o html montar o seu select então realmente o elemento combustivel não existe...

faça assim:

window.onload = function{
document.getElementById("combustivel")....
}

ou tambem colocar a sua tag <script> no final do documento, depois dos selects

Compartilhar este post

Link para o post
Compartilhar em outros sites

rodrigofariat    0

rodrigofariat
Postado

Voce sugeriu de colocar o </script> abaixo dos selects, mas pelo o que li, javascript são declarados depois de head.

 

Fiz algumas modificações no codigo mas ainda não funcionou, dessa vez o FireBug, não acusou erro.

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
		<title>Usando Select</title>
	</head>
		<script language="JavaScript">
          	{
		     /*document.getElementById("combustivel").options[2] = 'alcool';
		     document.getElementById("carros").options[2] =  'Parati';
		     */
			
				window.onload = function() 
				{
				   document.getElementById("combustivel").selectedIndex[2];
				   document.getElementById("carros").selectedIndex[2];
				}
			}	
		</script>
	<body>
          	
          <SELECT name="combustivel" id="combustivel">
          <OPTION>diesel</OPTION>
          <OPTION>gasolina</OPTION>
          <OPTION>alcool</OPTION>
          </SELECT>
          
		  <SELECT name="carros" id ="carros">
          <OPTION>Uno Mille</OPTION>
          <OPTION>Passat</OPTION>
          <OPTION>Parati</OPTION>
          </SELECT>
         
	</body>
</html>

O que pode estar faltando ?

 

Att,

 

Rodrigo Faria

Compartilhar este post

Link para o post
Compartilhar em outros sites

klonder    14

klonder
Postado

Eu acho um pouco mais fácil deixar apenas o selected no item default:

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
        <head>
                <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
                <title>Usando Select</title>
        </head>
        <body>
        
          <SELECT name="combustivel" id="combustivel">
          <OPTION>diesel</OPTION>
          <OPTION>gasolina</OPTION>
          <OPTION selected>alcool</OPTION>
          </SELECT>
          
          <SELECT name="carros" id ="carros">
          <OPTION>Uno Mille</OPTION>
          <OPTION>Passat</OPTION>
          <OPTION selected>Parati</OPTION>
          </SELECT>             
        </body>
</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites

lucasmartins    6

lucasmartins
Postado

Você pode fazer assim:

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Usando Select</title>
</head>
<script type="text/javascript">
window.onload = function() 
{
document.getElementById("combustivel").options[2].selected = true;
document.getElementById("carros").options[2].selected = true;
} 
</script>
<body>

<select name="combustivel" id="combustivel">
<option>diesel</option>
<option>gasolina</option>
<option>alcool</option>
</select>

<select name="carros" id="carros">
<option>Uno Mille</option>
<option>Passat</option>
<option>Parati</option>
</select>
</body>
</html>

 

E fora isso, ao veja as diferenças do meu código para o seu...

 

O que eram aqueles "{" e "}" desnecessários???

 

Porque colocou <script language="Javascript"> e não <script type="text/javascript">???

 

Huehueuhe... a tag script precisa apenas do tipo... o language não é necessário...

 

Abraços

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

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

  Aceito