Bonjour,
j'essaie de créer un site internet où je pourrai envoyer des fichiers par "drag & drop" mais je n'y arrive pas. Serait-il possible que vous m'aidiez ?
Code:
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70 <!doctype html> <html> <head> <meta charset="utf-8"> <title>Page Upload</title> <link rel="stylesheet" href="css/global.css"> </head> <body> <div class="dropzone" id="dropzone">Glissez le fichier que vous voulez upload sur le serveur</div> <div id="uploads"></div> <script> (function dropzone(typeof !== 'undefined') { var dropzone = document.getElementById('dropzone'); var displayUploads = function(data) { var uploads = document.getElementById('uploads'), anchor, x; for(x = 0; x < data.lenght; x = x +1) { anchor = document.createElement('a'); anchor.href = data[x].file; anchor.innerText = data[x].name; uploads.appendChild(anchor); } } var upload = function(files) { var formData = new FormData(), xhr = new XMLHttpRequest(), x; for(x = 0; x < files.lenght; x + 1) { formData.append('file[]', files[x]); } xhr.onload = function() { var data = this.responseText; var data = JSON.parse(this.responseText); displayUploads(data); } xhr.open('post', 'upload.php'); xhr.send(formData); } dropzone.ondrop(typeof dropzone.ondrop !== 'undefined') = function(e) { e.preventDefault(); this.className = 'dropzone'; upload(e.dataTransfer.files); }; drop.ondragover(typeof dropzone.ondragover !== 'undefined') = function() { this.className = 'dropzone dragover'; return false; }; drop.ondragleave(typeof dropzone.ondragleave !== 'undefined') = function() { this.className = 'dropzone'; return false; } }); </script> </body> </html>
Cordialement,
xxloubexx.
Partager