Mostrando dialogo ‘selezionare il file’ del browser quando concentrandosi input [type = file] attraverso la navigazione da tastiera
-
20-09-2019 - |
Domanda
Come dice il titolo, voglio che la finestra di dialogo ‘selezionare il file’ per aprire quando un certo input
ottiene lo stato attivo da tabulazione attraverso i campi del modulo (utilizzando la tastiera). Per impostazione predefinita, la finestra di ‘selezionare file’ si apre solo quando il campo viene cliccato.
ho messo su una pagina su JS Bin per questo problema: http://jsbin.com/areba/edit
Al momento, questa pagina è costituito da seguente codice:
<!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>
Come si può vedere, c'è un input di testo e un file di input. L'idea è che quando l'ingresso di testo viene attivato, il file di input viene ‘cliccato’ o qualsiasi altra cosa e si apre la finestra di ‘selezionare il file’.
La dichiarazione .css('background', 'lime')
sembra funzionare bene; tuttavia, invocando .trigger('click')
sull'ingresso file sembra non fare niente.
(mi rendo conto che questo potrebbe causare un problema di accessibilità, quindi per favore, cerchiamo di non parlarne. Grazie.)
Soluzione
Questo funziona in IE e Safari (credo), ma non in Opera o Firefox, in quanto non hanno implementato il click () evento per gli elementi di upload di file - edit:. Ancora
Altri suggerimenti
dubito che sarebbe in grado di fare attivare la finestra per motivi di sicurezza. Un vero e proprio evento click deve accadere, a seconda del browser.
So Flash / Flex hanno questo requisito.