У меня есть веб-страница, которая отслеживает ход загрузки файла. Это источник HTML:
<form>
<input type="hidden" id="id" name="UPLOAD_IDENTIFIER" value="4dc6f7819200e">
<input type="file" name="image">
<input type="submit" value="Upload file">
</form>
<div id="progress"></div>
<iframe id="upload-frame" name="upload-frame"></iframe>
А это мой javascript (я использую jQuery):
var pbar = $("#progress");
var started = false;
$(function() {
$("form").submit(function() {
pbar.show().progressbar();
$("#upload-frame").load(function() {
started = true;
}
setTimeout(function() {
updateProgress($("#id").val());
}, 500);
});
});
function updateProgress(id) {
$.get("my/url/here?id=" + id, function(progress) {
if (null === progress) {
updateProgress(id);
}
if (progress<100 || !started) {
started = progress < 100;
updateProgress(id);
}
started && pbar.progressbar('value', progress);
}
};
Я оставляю код на стороне сервера, потому что это странная вещь: Firefox и IE работают нормально. Только веб-браузеры (Chrome, Chromium, Safari) показывают начало индикатора выполнения, но не обновляют их. Это почему? Есть мысли?