HTML SELECT em branco sem item em branco na lista suspensa

Como implementar subj?

quando eu escrevo:

<form>
  <select>
     <option value="0">aaaa</option>
     <option value="1">bbbb</option>
  </select>
</form>

então o item padrão selecionado é "aaaa"

quando eu escrevo:

<form>
  <select>
     <option value=""></option>
     <option value="0">aaaa</option>
     <option value="1">bbbb</option>
  </select>
</form>

então o item padrão selecionado fica em branco, mas este item em branco é apresentado no menu suspenso.

como posso implementar a marca SELECT com valor em branco padrão que está oculto na lista suspensa?

Basta usar atributos desativados e / ou ocultos:

<option selected disabled hidden style='display: none' value=''></option>

• selected torna esta opção a padrão.
• disabled torna esta opção não clicável.
• style='display: none'faz com que esta opção não seja exibida em navegadores mais antigos. Veja: Posso usar a documentação para o atributo oculto.
• hidden faz com que essa opção não seja exibida na lista suspensa.

Você pode definir selectedIndexpara -1usar .prop: http://jsfiddle.net/R9auG/ .

Para versões mais antigas do jQuery, use em .attrvez de .prop: http://jsfiddle.net/R9auG/71/ .

Simplesmente usando

<option value="" selected disabled>Please select an option...</option>

funcionará em qualquer lugar sem script e permitirá que você instrua o usuário ao mesmo tempo.

<select>
     <option value="" style="display:none;"></option>
     <option value="0">aaaa</option>
     <option value="1">bbbb</option>
  </select>

Aqui está uma maneira simples de fazer isso usando JavaScript simples. Este é o equivalente básico do script jQuery postado por pimvdb. Você pode testar aqui .

<script type='text/javascript'>
  window.onload = function(){
    document.getElementById('id_here').selectedIndex = -1;
  }
</script>

.

<select id="id_here">
  <option>aaaa</option>
  <option>bbbb</option>
</select>

Certifique-se de que o "id_here" corresponda no formulário e no JavaScript.

Você não pode. Eles simplesmente não funcionam dessa maneira. Um menu suspenso deve ter uma de suas opções selecionada o tempo todo.

Você pode (embora eu não recomende) observar um evento de mudança e, em seguida, usar JS para excluir a primeira opção se estiver em branco.

Para HTML puramente, @isherwood tem uma ótima solução. Para jQuery, dê ao menu suspenso de seleção um ID e selecione-o com jQuery:

<form>
  <select id="myDropDown">
    <option value="0">aaaa</option>
    <option value="1">bbbb</option>
  </select>
</form> 

Em seguida, use este jQuery para limpar o menu suspenso no carregamento da página:

$(document).ready(function() {
    $('#myDropDown').val(''); 
});

Ou coloque-o dentro de uma função por si só:

$('#myDropDown').val(''); 

realiza o que você está procurando e é fácil colocar isso em funções que podem ser chamadas em sua página se você precisar apagar o menu suspenso sem recarregar a página.

Você pode tentar este trecho

$("#your-id")[0].selectedIndex = -1

Funcionou para mim