Agora venho com outra dúvida pois sou iniciante em javascript.
Bom, tenho essa função que quando se clica na aba tarefas cadastradas aparece uma div com um select(combobox).
Como eu faço para quando eu clicar em tarefas recebidas a div desapareça novamente. Ela só desaparece quando eu clico novamente em tarefas cadastradas.
Pode até ser bem básico mas estou ainda engatinhando em js.
Quem puder ajudar agradeço.
window.onload = function(){
var div = document.querySelector('div#minhaDiv');
var section = document.querySelector('section#secao');
section.addEventListener('click', function() {
var aberto = div.classList.contains('teste');
div.classList.toggle('teste2');
});
}
.teste {
display: none;
}
.teste2 {
display: block;
}
<div class="teste" id="minhaDiv">
Filtro busca2:
<select name="" onchange="" id="">
<option value="0">...</option>
<option value="1">Prazo decrescente</option>
<option value="2">Prazo crescente</option>
<option value="3">Título A - Z</option>
<option value="4">Título Z - A</option>
</select>
</div>
<section id="" onclick="">
<p class="title" data-section-title>
<a href="#">Tarefas Realizadas</a>
</p>
<div class="content" data-section-content>
<table class="responsive" width="100%">
<thead>
<tr>
<th width="15%">A Tarefa</th>
<th width="15%">Funcionário</th>
<th width="15%">Setor</th>
<th width="5%">Status</th>
<th width="10%" style="text-align:center;">Prazo</th>
<th width="10%">Nível Urgência</th>
<th width="10%">Dia Fechamento</th>
<th width="7%" style="text-align:center;">Editar</th>
<th width="7%" style="text-align:center;">Excluir</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</section>
<section id="secao" onclick="">
<p class="title" data-section-title>
<a href="#">Tarefas Cadastradas</a>
</p>
<div class="content" data-section-content>
<table class="responsive" width="100%">
<thead>
<tr>
<th width="15%">A Tarefa</th>
<th width="15%">Funcionário</th>
<th width="15%">Setor</th>
<th width="5%">Status</th>
<th width="10%" style="text-align:center;">Prazo</th>
<th width="10%">Nível Urgência</th>
<th width="10%">Dia Fechamento</th>
<th width="7%" style="text-align:center;">Editar</th>
<th width="7%" style="text-align:center;">Excluir</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</section>