Запуск ввода файла IE9 с использованием Javascript

Question

У меня было сообщение здесь:

.change ведет себя странно в IE9

Однако я столкнулся с новым инцидентом, связанным с обработкой форм загрузки файлов ибыло любопытно, сталкивался ли кто-нибудь с этой проблемой.

Моя первоначальная проблема заключалась в том, что я не мог заставить работать событие onchange, и я подумал, что, возможно, это проблема с моим JavaScript, но я обнаружил, что это нужнос тем, как форма активируется.

У меня есть файл ввода

<input type="file" name="abc"/>

Теперь я сделал 2 вещи.

Я спрятал ввод и создал кнопку (для лучшего контроля стиля), которая активирует ввод.

<button id="mybutton">click to upload a pic</button>
<input type="file" name="abc"/>

, а затем JS для взаимодействия между ними:

$("#mybutton").click(function() {
    $("Input[type=file]").click()
};

и, конечно же, отправка формы (в этом примере я использую parent, но вы в своем коде я использую идентификатор формы).

$("input[type=file]").change(function() {
  $(this).parent().submit();
});

Когда я нажимаю "mybutton"ожидаемый результат действительно происходит, открывается мое окно просмотра и позволяет мне выбрать файл с моего компьютера.Также, когда я изменяю файл во всех браузерах, кроме IE, происходит событие onchange.Теперь, если я раскрою форму и вручную нажму кнопку «Обзор» и выберу файл, событие onchange будет запущено.Таким образом, в основном браузер обрабатывает нажатие кнопки фактического файла иначе, чем $ ("input [type = file]"). Click ()

Кто-нибудь знает, как это исправить?

Answer 1

Как уже было сказано, IE очень строг при отправке формы, содержащей входные данные.Ввод файлов должен быть активирован с помощью реального щелчка мыши, чтобы разрешить отправку формы.Кроме того, похоже, что в IE9 и файлах есть ошибка.

Хорошая новость заключается в том, что существует способ обойти ограничение безопасности в IE с помощью метки:

1. Создатьобычный тег метки, связанный с вашим файлом ввода.Метка будет запускать входной файл, как обычно.
2. Маскировать метку как кнопку с помощью CSS.
3. Ввод файла должен отображаться (для IE8), но его можно скрыть с помощью "видимость: скрыто ".IE8 примет этот взлом.

Answer 2

Если я не сильно ошибаюсь, вы не можете изменить это, поскольку это (было изначально) предназначено для защиты конфиденциальности пользователей, избегая загрузки файлов без явного разрешения пользователя / действия.

Answer 3

1. убедитесь, что ваш код находится в $("document").ready(function(){... here..});

2. , кажется, входные файлы при подключении с .live("change", function(){}); не совсем хорошо работают

другой стиль - это нечто другое, но CSS не так уж и сложен - красивая загрузка файла