Как правильно нажимать клавишу ввода, когда ввод файла имеет фокус?

У меня есть простая форма. Он содержит ввод типа "ФАЙЛ" и кнопку отправки. Он проходит 508 испытаний на соответствие, и у них есть проблема.

Если вы перейдете на вход FILE и нажмете клавишу ввода, IE отправит форму. Насколько я понимаю, это правильное поведение. Я не делаю Javascript или что-либо еще, чтобы преднамеренно изменить поведение нажатия клавиши.

Наши 508 тестировщиков не согласны и считают, что нажатие клавиши ввода на входе FILE должно открыть диалоговое окно обзора. Я не нашел ничего убедительного, но я надеялся, что кто-то сможет прояснить для меня. Образец формы ниже.

<form id="upload_Form" METHOD="POST" ENCTYPE="multipart/form-data" action="" NAME="uploadForm">
<INPUT TYPE="FILE" NAME="filenames" id="filenames" title="Select File for Upload">
<input type="submit" value="Upload"/>
</form>

2 ответа

Решение

В <input type="file"/> Элемент, в современных браузерах акцент делается на кнопку, которая вызывает диалог выбора файла. Нажатие Enter в этом случае должно вызвать диалог вместо отправки формы. IE, конечно, все делает по-своему. Я был бы склонен соответствовать IE стандартам, а не наоборот.

Но, главное, зачем вам сознательно отправлять форму, если это поле не заполнено? В лучшем случае это ошибка проверки.

На самом деле, это вопрос консенсуса. Я лично считаю, что использование клавиши ввода вместо пробела для запуска диалога просмотра - это правильное поведение с точки зрения доступности, скажем, более интуитивное для обычного пользователя. Вот почему WebKit делает это, вместо того, чтобы отправлять форму, когда ввод загружен.

Простой обходной путь jQuery как исправление для IE:

$(document).keypress(
    function(event){
     if (event.which == '13') {
        event.preventDefault();
         $('#upload-form').click();
      }
});

Демо Фиддл

Другие вопросы по тегам