Это в основном и упрощенно то, что у меня есть сейчас:
<style>
form.noshow { height: 0; overflow: hidden; }
</style>
<form class=noshow target="SomeIframeThatExists">
<input type=file id=uf>
</form>
<a id=uflink href="/user/photo">Upload photo</a>
<script>
$('uf').addEvent('change', function(e) {
// alert('oele'); // this would work fine
this.form.submit(); // auch in IE > "Access denied" exception
});
$('uflink').addEvent('click', function(e) {
$('uf').click(); // opens file dialog in all browsers inc IE
return false;
});
</script>
Что он делает (идеально) в Chrome 11 и FF 4 :
Очень высокотехнологично и мило.
В IE все работает, кроме [6]. Форма не отправлена. Ошибка Javascript: «Доступ запрещен». Неважно, насколько форма невидима, пока диалог был открыт с помощью input.click ()
, форма не может быть отправлена при изменении. (Функция onchange выполняется нормально. Ошибка возникает только при вызове form.submit ()
. )
Теперь все это я могу принять. IE отстой. Я живу с этим.
Моим решением до сих пор было проверить навигатор
на наличие «MSIE», а затем, щелкнув ссылку, вместо открытия диалогового окна, показать форму (с вводом файла). Затем пользователь должен щелкнуть фактический некрасивый ввод файла, и тогда все работает нормально. Но уродливо.
Вопрос двоякий:
! Navigator.contains («MSIE»)
)? [2] мог обнаружить исключение «Доступ запрещен» в IE, но тогда уже слишком поздно: пользователь уже открыл диалоговое окно и перешел к фотографии. Вы не хотите заставлять его делать это снова. (Даже пользователи IE этого не заслуживают.)
PS. Меня интересуют только Chrome 10+, Firefox 3.6+ и IE8 +.
PS. Может быть важно: элемент ввода файла не может находиться где-либо рядом со ссылкой, потому что ссылка находится внутри формы, и эта форма (должна быть) отдельной от формы загрузки файла.
ОБНОВЛЕНИЕ
Вторая Лучшее: обнаружите поддержку этого высокотехнологичного поведения, которое не работает только в IE. Я не хочу использовать navigator.appName.contains ('MSIE')
, потому что это не гибко и не обязательно верно.