Ocultar ao Selecionar

Exibindo e ao selecionar desaparecer DIV

by Rapha Souza

HTML

<link rel="stylesheet" href="https://getbootstrap.com/dist/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-latest.min.js"></script>
<script src="https://igorescobar.github.io/jQuery-Mask-Plugin/js/bootstrap.min.js"></script>
<script src="https://igorescobar.github.io/jQuery-Mask-Plugin/js/jquery.mask.min.js"></script>
  <div class="row">
     	   <div class="form-group col-md-3">
                  <label for="TipodeDocumento_6" >Tipo de Documento</label>
                  <select class="form-control" name="TipodeDocumento_6" id="TipodeDocumento_6"  >
                    <!-- onChange="limpa(),ct_campos( this )" -->
                    <option value="" selected>Selecione</option>
                    <option value="Contratos_Aditivos">Contratos e Aditivos</option>
                    <option value="Notas_Fiscais">Notas Fiscais</option>
                    <option value="boletos">Boletos</option>
                    <option value="Comprovante_Pagamento">Comprovante de Pagamento</option>
                    <option value="Garantias">Garantias</option>
                    <option value="Manuais_Equipamentos">Manuais de Equipamentos</option>
                    <option value="Protocolo_Faturas">Protocolo de Faturas</option>
                  </select>
                
              </div>
     	
     </div>
  
              
           <div class="div-sel panel panel-default" id="Protocolo_Faturas">
          <div class="panel-heading ">
            <h3 class="panel-title"><b>Protocolo de Faturas</b></h3>
          </div>
          <div class="panel-body">
            <div class="row">
              <div class="col-md-3">
                <div class="form-group">
                  <label for="FontePagadora_15">Fonte Pagadora</label>
                  <input type="text" class="form-control" name="FontePagadora_15" id="FontePagadora_15">
                </div>
              </div>
              <div class="col-md-3">
                <div...

JavaScript

$(function ocultar_div() { //onload aqui
  $('#TipodeDocumento_6').on('change', function() {
    $('.div-sel').show();
    let idSelecionado = $(this).val(); //construir o id
    if (idSelecionado != "") $("#" + idSelecionado).hide(); //mostrar o elemento
  });
  
  $('#TipodeDocumento_6').trigger("change"); //aplicar a lógica do change
})