Загрузка прогресса (с или без XMLHttpRequest 2) с Javascript

Question

XMLHttpRequest 2 есть новая вещь.Он может загружать файлы.Я получил это работает (это очень легко).Теперь мне интересно, есть ли способ получить прогресс загрузки этого файла.Обычно меня это не интересует, но в Google Chrome (8) я увидел, что событие onreadystatechange - XMLHttpRequestProgressEvent.Прогресс ... Там нет ничего о прогрессе загрузки (просто состояние запроса), но меня это удивляет.

В Google Chrome есть счетчик прогресса при загрузке больших файлов.Это стандартно.Это всегда там и не поддается настройке.Это в статусбаре.Возможно ли что-то подобное с Javascript?Я хотел бы поместить его в красивый <progress> элемент или что-то в этом роде.

Я не хочу загрузчиков SWF или Java (с опросом и обратными вызовами> JS).Это должно быть родным.Если браузер может это сделать, в наши дни Javascript должен это делать, верно !?=)

В случае отсутствия XMLHttpRequest 2, я думаю, это было бы невозможно при очень стандартной загрузке файла (без ajax и просто <input type=file>).

Спасибо заинформация

Answer 1

Подцепить событие прогресса. Это даст вам прогресс по всем запросам. Сначала проверьте, доступен ли объект загрузки - это даст вам прогресс только для части загрузки.

Примерно так:

var xhr; // this is your XMLHttpRequest

// hook to upload events if available, otherwise snag all progress events
var eventSource = xhr.upload || xhr;

eventSource.addEventListener("progress", function(e) {
    // normalize position attributes across XMLHttpRequest versions and browsers
    var position = e.position || e.loaded;
    var total = e.totalSize || e.total;

    // TODO: display progress
});