Mostrando a caixa de diálogo 'Selecionar arquivo' do navegador ao concentrar a entrada [TIPE = FILE] através da navegação do teclado

StackOverflow https://stackoverflow.com/questions/1734478

Pergunta

Como o título diz, eu quero que a caixa de diálogo 'Selecionar arquivo' seja aberta quando um certo input Obtém o foco, tabulando os campos do formulário (usando a navegação no teclado). Por padrão, a janela 'Selecionar arquivo' abre apenas quando o campo é clicado.

Coloquei uma página no JS Bin para esta edição: http://jsbin.com/areba/edit

Atualmente, esta página consiste no seguinte código:

<!doctype html> 
<html> 
 <head> 
  <title>Sandbox</title> 
  <meta charset="utf-8"> 
 </head> 
 <body> 
  <form> 
   <input type="text"> 
   <input type="file">
  </form>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
  <script>
   $(function() {
    $('input[type=text]').focus(function() {
     $(this).next('input[type=file]').css('background', 'lime').trigger('click');
    });
   });
  </script>
 </body> 
</html>

Como você pode ver, há uma entrada de texto e uma entrada de arquivo. A idéia é que, quando a entrada do texto recebe foco, a entrada do arquivo é 'clicada' ou o que quer que seja e a janela 'Selecionar arquivo' seja aberta.

o .css('background', 'lime') A declaração parece funcionar bem; No entanto, invocando .trigger('click') Na entrada do arquivo, parece não fazer nada.

(Percebo que isso pode causar um problema de acessibilidade, então, por favor, não vamos discutir isso. Obrigado.)

Foi útil?

Solução

Isso funcionará no IE e no Safari (eu acho), mas não na ópera ou no Firefox, pois eles não implementaram o evento click () para elementos de upload de arquivos - editar: ainda.

Outras dicas

Duvido que você possa ativar a caixa de diálogo por motivos de segurança. Um evento de clique real tem que acontecer, dependendo do navegador.

Eu sei que Flash/Flex tem esse requisito.

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top