Сеletor file

O seletor :file seleciona elementos do tipo file, que são campos de upload de arquivos. O equivalente a $(':file') é $('[type=file]'). Como :file não pertence à especificação CSS, para melhorar o desempenho em navegadores modernos é melhor usar [type='file'] em seu lugar.

Sintaxe

É assim que selecionamos elementos do tipo file:

javascript$(':file');

Assim como com outros pseudo-seletores de classe (que começam com ':'), é melhor colocar o nome da tag ou outro seletor antes do ':', caso contrário, o seletor '*' será aplicado, ou seja, $(':file') será interpretado como $('*:file'), portanto, é melhor usar $('input:file') em vez disso.

Exemplo

Vamos selecionar todos os inputs do tipo file e tornar seu fundo verde e sua borda vermelha usando o método css:

html<form>
  <input type="button" value="button">
  <input type="file">
  <input type="password">
  <button>button</button>
  <input type="reset">
  <input type="radio" name="test">
  <input type="radio" name="test">
  <input type="checkbox">
  <input type="text">
</form>

<

+javascript+> $('form input:file').css({background: 'green', border: '2px red solid'}); $('form').submit(function(event) { event.preventDefault(); // impede o envio do formulário });

<

-javascript->

Veja também

  • método filter,
    que filtra elementos em um conjunto conforme um seletor especificado
  • método find,
    que procura elementos dentro dos já encontrados
  • método css,
    que permite obter e modificar estilos CSS de um elemento