[ Поиск ] - [ Пользователи ] - [ Календарь ]
Полная Версия: Drag&Drop загрузка картинок с превью
McLotos
Добрый день.
Вожусь со страницей регистрации автомобилей, застрял на половине анкеты, на моменте где нужно загрузить фотографии. Скрипт не загружает фотки на сервер, а просто открывает их в браузере, подскажите как это лечится? На сколько я помню там нужно перехватывать события браузера, но я не помню как =)
 dropzone = document.getElementById('dropzone');
maxFileSize = 100000;
dropzone.ondragover = function() {
dropzone.style.ClassName='hover';
return false;
};

dropzone.ondragleave = function() {
dropzone.style.ClassName='';
return false;
};

dropzone.ondrop = function(event) {
event.preventDefault();
dropzone.style.ClassName='';
dropzone.style.ClassName='drop';

var file = event.dataTransfer.files;
for(i=0;i<file.length;i++)
{
if (file[i].size > maxFileSize) {
dropzone.innerHTML='Файл слишком большой! Размер файла: '+file[i].size+'. Разрешенный размер файла: '+maxFileSize;
dropzone.style.ClassName='error';
return false;
}
var xhr = new XMLHttpRequest();
xhr.upload.addEventListener('progress', uploadProgress, false);
xhr.onreadystatechange = stateChange;
xhr.open('POST', '/uploads.php');
xhr.setRequestHeader('X-FILE-NAME', file[i].name);
xhr.send(file[i]);
}


}
;

function uploadProgress(event) {
var percent = parseInt(event.loaded / event.total * 100);
dropzone.innerHTML = 'Загрузка: ' + percent + '%';
}

function stateChange(event) {
if (event.target.readyState == 4) {
if (event.target.status == 200) {
dropzone.innerHTML='Загрузка успешно завершена!';
} else {
dropzone.innerHTML = 'Произошла ошибка!';
dropzone.style.ClassName = 'error';
}
}
}
}


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

_____________
программирование - инструмент для решения конкретных задач, любая попытка спроектировать что-то универсальное приведет к провалу.©paul85
В любом случае тебе прийдётся пройти путь изобретения велосипеда, который прошли другие, только причиной твоего изобретения будет непонимание принципов работы велосипеда изобретённого другими людьми.©SlavaFr
jQuery это попытка использовать АН-225 для перевозки зубочистки
Быстрый ответ:

 Графические смайлики |  Показывать подпись
Здесь расположена полная версия этой страницы.
Invision Power Board © 2001-2024 Invision Power Services, Inc.