viiprogrammer Опубликовано 11 апреля, 2015 Жалоба Поделиться Опубликовано 11 апреля, 2015 Загрузка файлов с Dragn & Drop и так создадим файл назавём его index.html с таким содержимым <!DOCTYPE html> <html lang="ru"> <head> <meta charset="UTF-8"> <title>Drag and Drop</title> <style> body { background: #FFF; font: 20px Arial; } .dropzone { width: 300px; height: 300px; border: 2px dashed #BAC7D4; color: #BAC7D4; line-height: 280px; text-align: center; position: absolute; left: 50%; ; top: 50%; margin-top: -150px; } .dropzone.dragover { color: #BAC7D4; border: 2px dashed #BAC7D4; } </style> </head> <body> <p>Загруженные файлы:</p> <div id="uploads"> <ul> </ul> </div> <div class="dropzone" id="dropzone">Перетащите файлы сюда</div> <script> (function() { var dropzone = document.getElementById("dropzone"); dropzone.ondrop = function(e) { this.className = 'dropzone'; this.innerHTML = 'Перетащите файлы сюда'; e.preventDefault(); upload(e.dataTransfer.files); }; var displayUploads = function(data) { var uploads = document.getElementById("uploads"), anchor, x; for(x = 0; x < data.length; x++) { anchor = document.createElement('li'); anchor.innerHTML = data[x].name; uploads.appendChild(anchor); } }; var upload = function(files) { var formData = new FormData(), xhr = new XMLHttpRequest(), x; for(x = 0; x < files.length; x++) { formData.append('file[]', files[x]); } xhr.onload = function() { var data = JSON.parse(this.responseText); displayUploads(data); }; xhr.open('post', 'upload.php'); xhr.send(formData); }; dropzone.ondragover = function() { this.className = 'dropzone dragover'; this.innerHTML = 'Отпустите мышку'; return false; }; dropzone.ondragleave = function() { this.className = 'dropzone'; this.innerHTML = 'Перетащите файлы сюда'; return false; }; }()); </script> </body> </html> После создадим upload.php <?php header("Content-Type: application/json"); $uploaded = array(); if(!empty($_FILES['file']['name'][0])) { foreach($_FILES['file']['name'] as $position => $name) { $path_info = pathinfo($name); if($path_info['extension'] == 'png' or $path_info['extension'] == 'gif' or $path_info['extension'] == 'zip' or $path_info['extension'] == 'jpg' or $path_info['extension'] == 'rar'){ if(move_uploaded_file($_FILES['file']['tmp_name'][$position], 'uploads/'.$name)) { $uploaded[] = array( 'name' => 'Файл '.$name.' загружен', 'file' => 'uploads/'.$name ); } }else $uploaded[] = array('name' => 'Не правильный формат', 'file' => ''); } } echo json_encode($uploaded); ?> И не забываем создать папку uploads с правами 777 1 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
JacksScripts Опубликовано 12 апреля, 2015 Жалоба Поделиться Опубликовано 12 апреля, 2015 Для тех кто работает по примерам, очень отличная штука Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
JacksScripts Опубликовано 12 апреля, 2015 Жалоба Поделиться Опубликовано 12 апреля, 2015 Dragn & Drop Ошибка в слове "Dragn", пишеться "Drag" 1 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
viiprogrammer Опубликовано 12 апреля, 2015 Автор Жалоба Поделиться Опубликовано 12 апреля, 2015 Dragn & Drop Ошибка в слове "Dragn", пишеться "Drag" Упс! Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Рекомендуемые сообщения
Присоединяйтесь к обсуждению
Вы можете написать сейчас и зарегистрироваться позже. Если у вас есть аккаунт, авторизуйтесь, чтобы опубликовать от имени своего аккаунта.
Примечание: Ваш пост будет проверен модератором, прежде чем станет видимым.