При попытке загрузить несуществующий файл в Internet Explorer форма не отправляется.
-
22-08-2019 - |
Вопрос
У меня есть форма с input type=file
.Internet Explorer позволяет пользователю вводить в этот ввод все, что он хочет (тогда как Firefox вызывает средство выбора файлов).Если пользователь вводит явно недопустимое имя, например:
a
и пытается отправить форму, Internet Explorer даже не пытается отправить форму.
Есть ли способ узнать, что это произошло, и сообщить пользователю, что это происходит, с помощью предупреждения?
Решение 2
Я нашел лучший способ сделать это:http://www.priddypictures.co.uk/reference/fileInputProblem.htm
Итак, если эти парни/девчонки правы и форма отправляется нормально, если входные данные не имеют атрибута имени, тогда:
- напишите плагин jQuery, который (если Internet Explorer) удалит атрибут имени из всех входных файлов.
- вставьте в форму еще один скрытый ввод с правильным именем
- скопировать значение из ввода файла в скрытый ввод
Возможно, когда-нибудь я напишу этот плагин.
Другие советы
Вам следует добавить событие «onclick()» к кнопке отправки, которое вызывает функцию JavaScript, которая проверяет ваше состояние и использует «предупреждение» JavaScript, чтобы сообщить пользователю, что ему нужно ввести что-то достойное отправки.
Изучите регулярные выражения для своих тестов.
Если вы хотите, чтобы пользователь принял решение, используйте confirm()
.
Если вы хотите просто предупредить их, а не проверять их ценность, вы можете использовать что-то вроде:
<input type="submit" value="clickme" onClick="if (confirm('Really submit?')) { this.form.submit(); }">
Вот пример кода, который получит значение из вызова функции JavaScript внутри onclick()
:
<html>
<head>
<title>hello world</title>
<SCRIPT LANGUAGE="javascript" type="text/javascript">
function show_me(form_elem) {
alert(form_elem.value);
}
</script>
</head>
<body>
<form method="GET" name="upload_form" action="index.html" target="_top">
<input type="file" name="file_name" size="14" maxlength="256" value="">
<br>
<input type="submit" value="mybutton" onclick="show_me(this.form.file_name)" />
</form>
</body>
</html>
Вы можете имитировать поведение Firefox следующим образом:
<input type="file" name="test" onkeypress="this.click();return false;">
Когда пользователь пытается ввести входной файл, у него появляется окно выбора файла.
Очевидно, это не сработает, если у клиента отключен JavaScript, но в зависимости от ваших требований это может быть «достаточно хорошо».
Кажется, работает нормально в IE 6, 7 и 8.
В Firefox 3 это работает нормально (поскольку он не позволяет вводить <input type=file>
).
Он нормально работает в Safari для Windows 3 и 4 (поскольку он не позволяет вводить <input type=file>
).
В Opera 9 (которая позволяет вводить <input type=file>
) он ничего не делает (не вызывает окно выбора и не поглощает нажатия клавиш).А onkeypress
событие, похоже, вообще не срабатывает, возможно, в целях безопасности.
В Firefox 2 это не работает (что позволяет вводить <input type=file>
) потому что this.click()
не появляется окно выбора и return false
проглатывает нажатия клавиш.