Вход | Регистрация | FAQ
Anonymous

Como esconder div ao selecionar checkbox?

+ Ответить

Сообщений: 5 Страница 1 из 1


Como esconder div ao selecionar checkbox?

synsynho » Сб ноя 09, 2013 12:12 pm

Olá!

Estou criando um sistema de testa em html, sou iniciante e queria tirar uma dúvida:

Vamos supor que o "[]" é o checkbox e o quadrado grande seja o textarea. Preciso que ocorra o seguinte processo:

Quando o checkbox estiver desmarcado, deve aparecer o campo textarea:

[] Funcionando.
_________________________
|Erro Erro Erro Erro Erro Erro E.|
|Erro Erro Erro Erro Erro Erro E.|
|Erro Erro Erro Erro Erro Erro E.|
|_________________________|

Quando o checkbox estiver desmarcado não deve aparecer o campo textarea:

[x] Funcionando.

Até agora só consegui fazer o contrário: Quando o checkbox está marcado, aparece o textarea, quando ele está desmarcado, o textarea desaparece, porém, não é pra acontecer isso, pois quando marcar a opção "Funcionando" não será necessário informar o erro que está ocorrendo no sistema da empresa. E quando nao estiver marcado, o erro deve ser relatado logo abaixo.

Bom, é isso, agradeço se conseguirem ajudar.
Аватара пользователя

synsynho

  • Сообщения: 3
  • Зарегистрирован: Сб ноя 09, 2013 12:01 pm

Re: Como esconder div ao selecionar checkbox?

XainPro » Пн ноя 11, 2013 6:20 pm

<html>
<head>
<title>
Document
</title>
<script>
function redi() {
if(!document.getElementById("checkbox").checked)
{
document.getElementById("textArea").innerHTML ='';
document.getElementById("textArea").innerHTML ='<textarea id="wmd-input" rows="15" cols="92" name="post-text"></textarea>';
}
else {
document.getElementById("textArea").innerHTML ='';
}
}
</script>
</head>
<body>
<p>
<label for="name">checkbox:</label>
<input for="name" id="checkbox" onclick="redi()" type="checkbox">
</p>
<p id="textArea">
<textarea id="wmd-input" rows="15" cols="92" name="post-text"></textarea>
</p>
</body>
</html>
Аватара пользователя

XainPro

  • Сообщения: 3933
  • Зарегистрирован: Пт фев 17, 2012 8:10 pm

Re: Como esconder div ao selecionar checkbox?

synsynho » Ср ноя 13, 2013 7:28 pm

XainPro, eu tentei isso que você me mandou e funcionou corretamente, porém, só funciona no primeiro item, preciso fazer a mesma coisa com uns 20 itens, ou seja, uns 20 checkbox que ao selecionar cada um, esconda a textarea correspondente, tem como você me ajudar com isso?
Аватара пользователя

synsynho

  • Сообщения: 3
  • Зарегистрирован: Сб ноя 09, 2013 12:01 pm

Re: Como esconder div ao selecionar checkbox?

XainPro » Чт ноя 14, 2013 12:54 pm

<html>
<head>
<title>
Document
</title>
<script>
function redi(theID) {
if(!document.getElementById("checkbox" + theID + "").checked)
{
document.getElementById(theID).innerHTML ='';
document.getElementById(theID).innerHTML ='<textarea rows="15" cols="92" name="'+ theID +'"></textarea>';
}
else {
document.getElementById(theID).innerHTML ='';
}
}
</script>
</head>
<body>
<p>
<label for="name">checkbox 1:</label>
<input for="name" id="checkboxtxt1" onclick="redi('txt1')" type="checkbox">
</p>
<p id="txt1">
<textarea rows="15" cols="92" name="txt1"></textarea>
</p>

<p>
<label for="name">checkbox 2:</label>
<input for="name" id="checkboxtxt2" onclick="redi('txt2')" type="checkbox">
</p>
<p id="txt2">
<textarea rows="15" cols="92" name="txt2"></textarea>
</p>

<p>
<label for="name">checkbox 3:</label>
<input for="name" id="checkboxtxt3" onclick="redi('txt3')" type="checkbox">
</p>
<p id="txt3">
<textarea rows="15" cols="92" name="txt3"></textarea>
</p>

<p>
<label for="name">checkbox 4:</label>
<input for="name" id="checkboxtxt4" onclick="redi('txt4')" type="checkbox">
</p>
<p id="txt4">
<textarea rows="15" cols="92" name="txt4"></textarea>
</p>

<p>
<label for="name">checkbox 5:</label>
<input for="name" id="checkboxtxt5" onclick="redi('txt5')" type="checkbox">
</p>
<p id="txt5">
<textarea rows="15" cols="92" name="txt5"></textarea>
</p>
</body>
</html>
Аватара пользователя

XainPro

  • Сообщения: 3933
  • Зарегистрирован: Пт фев 17, 2012 8:10 pm

Re: Como esconder div ao selecionar checkbox?

d4v1 » Чт фев 23, 2017 1:06 am

isso e perfeito, quase exatamente o que eu preciso, tentei usar da maneira que eu quero, mas ao clicar em um, mostra todos. me ajuda por favor??
preciso desse modelo ai, ao contrario.
preciso que as caixa de texto fique escondida mostrando apenas as "checkbox", e ao "tickar" aparecer apenas a box "tickada" e ao "tickar" outra box, ocultar e mostrar a nova que for "tickada".
no lugar dessa caixa de texto, irei colocar uma tag form. funciona também né?!
desde já obrigado.
Аватара пользователя

d4v1

  • Сообщения: 1
  • Зарегистрирован: Чт фев 23, 2017 12:45 am


+ Ответить

Страница 1 из 1

cron