Javascript работает в Webkit, но не FF - PullRequest
Новая
       48

Javascript работает в Webkit, но не FF

1 голос
/ 10 июня 2011

Я использую jQuery и Загрузчик файлов Эндрю Валума для обработки загрузки изображений ajax в моей форме. Желаемое поведение - немедленно загрузить файл на сервер, когда пользователь выберет ввод файла.

HTML-элемент: 

<input type="file" id="imgUpload" />

ЯШ: 

var uploader = new qq.FileUploaderBasic({
  button: $('#imgUpload')[0],
  //...
});

Вышеописанное прекрасно работает с Chrome и Safari, но не с Firefox. Есть ли различия в способах работы Firefox с JS? Большое спасибо.

РЕДАКТИРОВАТЬ: хотя я не являюсь экспертом по javascript, я думаю, что загрузчик файлов Valum заменяет целевой элемент ввода на свой собственный, который затем присоединяет слушатель onchange для обработки пользовательского запроса ajax. Это хорошо работает в Chrome. Однако в Firefox событие никогда не запускает запрос ajax. Ввод файла действует так же, как в обычной HTML-форме, и требует отправки формы. Там нет ошибок javascript или что-то еще, и все другие сценарии работают нормально во всех браузерах.

ОБНОВЛЕНИЕ: Все еще работает над этим. Оказывается, что qq.FileUploaderBasic инициализируется правильно, и событие "change" успешно отправляется элементом ввода. Он просто не вызывает обработчик событий в FF, как в Chrome.

1 Ответ

1 голос
/ 10 июня 2011

Оказывается, это проблема css, а не проблема Javascript.В результате скрипт загрузки файла создает элемент new <input type="file"> внутри целевого элемента ввода.Этот новый целевой элемент ввода имеет требуемый обработчик события изменения.

В Chrome нажатие на исходный ввод активирует новый элемент ввода, что вызывает желаемое поведение.Проблема в том, что в Firefox щелчок по исходному вводу каким-то образом активирует элемент ввода original вместо нового.Это является причиной проблемы.

Так что это скорее проблема кросс-браузерной CSS, чем проблема Javascript.Мой следующий шаг - выяснить, как заставить Firefox выбрать правильный элемент, но сейчас, надеюсь, это поможет тем, у кого такая же проблема.

...