I want to hide the small

Asked

Viewed 23 times

0

I have a select that has one with descriptive text. I need it to be hidden when you click the select and open the list of options, but it will be visible again when you click the select, or one of the options in the list.

<div id="select-default" class="select-box">
  <div class="options-container">
    <div class="option">
      <input type="radio" class="radio" id="label41" name="opcoes" />
      <label class="label-opcao" for="label41">label 41</label>
    </div>
    <div class="option">
      <input type="radio" class="radio" id="label42" name="opcoes" />
      <label class="label-opcao" for="label42">label 42</label>
    </div>
    <div id="selected-default" class="selected selected-erro" onclick="ocultar ('conteudo')">
      selecione...
    </div>
    <p id="label-select-erro" class="label-select">label</p>
  </div>
  <div id="conteudo">
    <div class="div-mensagem-select">
      <small class="mensagem-select text-roxo float-left">
        <p>Mensagem de erro</p>
      </small>
  </div>
 </div>

I used this function....

<script>
function ocultar(el) {
    var display = document.getElementById(el).style.display;
    if(display == "none")
        document.getElementById(el).style.display = 'block';
    else
        document.getElementById(el).style.display = 'none';
}

</script>

The way it is it is again visible when you click the second select, but it is not visible when you click on one of the options....

javascript html jquery select

1 answer

0

Do the check like this:

if (display !== 'block')

It needs to be done this way because the value of style.display by default comes blank - and is not affected by definitions made via CSS.

Browser other questions tagged javascript html jquery select

You are not signed in. Login or sign up in order to post.