Поиск сообщества
Показаны результаты для тегов 'Drop'.
Найдено: 1 результат
-
Загрузка файлов с 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
- 3 ответа
-
- 1
-
- file
- Dragn & Drop
-
(и ещё 2 )
C тегом: