Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Estou com um formulario onde coloquei uma caixa suspensa com varias opções, gostaria que quando alguem seleciona-se OUTROS... aparece-se uma caixa de texto para o usuario preencher...
como faria isso !?
>
Javascript amigo.
Captura o value do option que tem o "Outros", e dá um display block, num input text.
peguei um codigo de Display Block... mas não esta funcionando no IE só no FIREFOX....
SCRIPT:
<style type="text/css">
* {
margin: 0;
padding: 0;
color: #000;
}
ul li ul {
margin-left: 50px;
}
</style>
<script type="text/javascript">
function showMenu(subMenu){
var menu = document.getElementById(subMenu);
if ( menu.style.display == "none" ) {
menu.style.display = "block";
} else {
menu.style.display = "none";
}
}
function esconde(){
if(document.getElementById("escondido").style.display == "block"){
document.getElementById("escondido").style.display = "none";
}
else {
document.getElementById("escondido").style.display = "none";
}
}
</script>
SELECT BOX
<select size="1" name="curso" style="border:1px solid #C0C0C0; font-family: Verdana; font-size: 8pt; ">
<option onClick="esconde()">Selecione</option>
<option onClick="esconde()">Tecnologia em Segurança do Trabalho</option>
<option onClick="esconde()">Ciências Contábeis</option>
<option onClick="esconde()">Psicologia</option>
<option onClick="esconde()">Matemática (licenciatura)</option>
<option onclick="showMenu('escondido')">Outro</option>
</select><br>
BLOCO OCULTO
<ul id="escondido" style="display: none;">
<input type="text" name="T1" size="20" value="Digite qual o curso" style="font-family: Verdana; font-size: 8pt; color: #666666; border: 1px solid #C0C0C0"></ul>Pra que complicar amigo? Faça como William Bruno disse... olhe
podes fazer assim...
<style type="text/css">
* {
margin: 0;
padding: 0;
color: #000;
}
ul li ul {
margin-left: 50px;
}
</style>
<script type="text/javascript">
function exibe(){
var campo=document.getElementById('select').value;
if (campo=="outro")
{
document.getElementById('escondido').style.display="block";
}
else
{
document.getElementById('escondido').style.display="none";
}
}
</script>
<select size="1" id="select" name="curso" OnChange="exibe();" style="border:1px solid #C0C0C0; font-family: Verdana; font-size: 8pt; ">
<option value="">Selecione</option>
<option value="">Tecnologia em Segurança do Trabalho</option>
<option value="">Ciências Contábeis</option>
<option value="">Psicologia</option>
<option value="">Matemática (licenciatura)</option>
<option value="outro">Outro</option>
</select><br>
<div id="escondido" style="display: none;">
<input type="text" name="T1" size="20" value="Digite qual o curso" style="font-family: Verdana; font-size: 8pt; color: #666666; border: 1px solid #C0C0C0"></div>
Num precisa criar uma função e chamar em cada click do option nao....>
Pra que complicar amigo? Faça como William Bruno disse... olhe
podes fazer assim...
<style type="text/css">
* {
margin: 0;
padding: 0;
color: #000;
}
ul li ul {
margin-left: 50px;
}
</style>
<script type="text/javascript">
function exibe(){
var campo=document.getElementById('select').value;
if (campo=="outro")
{
document.getElementById('escondido').style.display="block";
}
else
{
document.getElementById('escondido').style.display="none";
}
}
</script>
<select size="1" id="select" name="curso" OnChange="exibe();" style="border:1px solid #C0C0C0; font-family: Verdana; font-size: 8pt; ">
<option value="">Selecione</option>
<option value="">Tecnologia em Segurança do Trabalho</option>
<option value="">Ciências Contábeis</option>
<option value="">Psicologia</option>
<option value="">Matemática (licenciatura)</option>
<option value="outro">Outro</option>
</select><br>
<div id="escondido" style="display: none;">
<input type="text" name="T1" size="20" value="Digite qual o curso" style="font-family: Verdana; font-size: 8pt; color: #666666; border: 1px solid #C0C0C0"></div>
Num precisa criar uma função e chamar em cada click do option nao....
este codgo que me passou não esta funcionando no IE... só no FIREFOX... (igual o meu, que a unica coisa que tem a+ é a função para ocultar o campo, caso o usuario mude de OUTRO para outra opção)
É?
Qual IE você testou? No meu IEca 6 funcionou...
IE6
/applications/core/interface/imageproxy/imageproxy.php?img=http://www.ubm.br/ie.jpg&key=fbea7ed4ce276d9215f2db03dc061c10f18eaaf077d6af864e4c708bb0a4e162" alt="Imagem Postada" />
Chrome
/applications/core/interface/imageproxy/imageproxy.php?img=http://www.ubm.br/crome.jpg&key=8047a5411607d2c06642fbdcdbe59a06475d074d01339d62d3acce010fa4e837" alt="Imagem Postada" />
Firefox
/applications/core/interface/imageproxy/imageproxy.php?img=http://www.ubm.br/firefox.jpg&key=7f74a5542cc71721fd72165d410d18ec6a96849c8059d17f432b33c3089081ff" alt="Imagem Postada" />
Num sei nos outros IE7 e no 8 num tenho ....
Olá galera...li o que foi postado e acho que posso ajudar!
Diferenças de javascript do IE/Firefox/Safari/Opera/Chrome
Estamos habituados a digitar rapidamente e não seguir alguns padrões simples de HTML que auxiliam outros linguagens, como o javascript.
O segredo de funcionamento em vários navegadores não está somente na sintáxe, mas também no ID.
Padrão Input: <input name="sdfs" type="text" size="10" maxlength="10" />
Correto:
Padrão Textarea: <textarea name="campo2" cols="4" rows="4" wrap="virtual"></textarea>
Correto: <textarea id="campo2" name="campo2" cols="4" rows="4" wrap="virtual"></textarea>
Olá galera...li o que foi postado e acho que posso ajudar!
Diferenças de javascript do IE/Firefox/Safari/Opera/Chrome
Estamos habituados a digitar rapidamente e não seguir alguns padrões simples de HTML que auxiliam outros linguagens, como o javascript.
O segredo de funcionamento em vários navegadores não está somente na sintáxe, mas também no ID.
Padrão Input: <input name="campo1" type="text" size="10" maxlength="10" />
Correto: <input id="campo1" name="campo1" type="text" size="10" maxlength="10" />
Padrão Textarea: <textarea name="campo2" cols="4" rows="4" wrap="virtual"></textarea>
Correto: <textarea id="campo2" name="campo2" cols="4" rows="4" wrap="virtual"></textarea>
Este Método ID+NAME deve ser utilizado em todos os tipos de campos do formulário: Rádio Group,Select,Hidden,Button,JumpMenu,Checkbox...etc
O próprio javascript já passa uma dica de quem ele irá utilizar por segurança contra falha: "document.getElementById('campoemquestao')"
Ou seja, a boa prática de usar a dupla dinâmica evita problema com navegadores e facilita para o JavaScript.
Utilize o exemplo passado e inclua o ID junto do NAME e veja se irá funcionar. OK
Espero ter ajudado no conceito.
=====================================================
POGRAMANO é na Rádio 89...hehehehe
Javascript amigo.
Captura o value do option que tem o "Outros", e dá um display block, num input text.