Отображение диалогового окна браузера ‘выбрать файл’ при фокусировке ввода [тип=файл] с помощью навигации по клавиатуре
-
20-09-2019 - |
Вопрос
Как следует из названия, я хочу, чтобы диалоговое окно "выбрать файл" открывалось, когда определенный input
получает фокус, перемещаясь по полям формы с помощью вкладок (используя навигацию с клавиатуры).По умолчанию окно ‘выбрать файл’ открывается только при нажатии на это поле.
Я разместил страницу в JS Bin по этому вопросу: http://jsbin.com/areba/edit
В настоящее время эта страница состоит из следующего кода:
<!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>
Как вы можете видеть, есть текстовый ввод и файловый.Идея заключается в том, что когда текстовый ввод получает фокус, на файловом вводе "щелкают" или что-то еще, и открывается окно ‘выбрать файл’.
Тот самый .css('background', 'lime')
оператор, кажется, работает нормально;однако, вызывая .trigger('click')
при вводе файла, похоже, вообще ничего не происходит.
(Я понимаю, что это может вызвать проблему с доступностью, поэтому, пожалуйста, давайте не будем это обсуждать.Спасибо.)
Решение
Это будет работать в IE и Safari (я думаю), но не в Opera или Firefox, поскольку они не реализовали событие click () для элементов загрузки файла - редактировать:пока.
Другие советы
Я сомневаюсь, что вы смогли бы активировать диалоговое окно по соображениям безопасности.Должно произойти реальное событие клика, в зависимости от браузера.
Я знаю, что у Flash / Flex есть это требование.