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
|
<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<
html
>
<
head
>
<
title
>TODO supply a title</
title
>
<
meta
charset
=
"UTF-8"
>
<
meta
name
=
"viewport"
content
=
"width=device-width, initial-scale=1.0"
>
<
style
>
#box{
width:150px;height: 150px;border: 1px solid red;
}
</
style
>
<
script
type
=
"text/javascript"
src
=
"XMLhttpReuest.js"
></
script
>
<
script
>
window.onload = function () {
var box = document.getElementById('box');
box.ondragenter = function (e) {
e.preventDefault();
}
box.ondragover = function (e) {
e.preventDefault();
}
box.ondragleave = function (e) {
e.preventDefault();
}
box.ondrop = function (e) {
e.preventDefault();
var file = e.dataTransfer.files[0];
var formData = new FormData();
formData.append('aa', file);
var xml = ajaxFunction();
xml.open("post", './upload.php', true);
xml.send(formData);
xml.onreadystatechange = function () {
if (xml.readyState == 4 && xml.status == 200) {
var flag = xml.responseText;
console.log(flag);
if (flag == 1) {
// box.innerHTML="上传成功";
alert('上传成功');
}
}
}
}
}
</
script
>
</
head
>
<
body
>
<
p
id
=
"box"
>
请拖入上传的文件
</
p
>
</
body
>
</
html
>
|
upload.php
1
2
3
4
5
6
|
<?php
header(
"Content-Type:text/html;charset=UTF-8"
);
if
(
is_uploaded_file
(
$_FILES
[
'aa'
][
'tmp_name'
])){
move_uploaded_file(
$_FILES
[
'aa'
][
'tmp_name'
],
"./"
.iconv(
"UTF-8"
,
"GBK"
,
$_FILES
[
'aa'
][
'name'
]));
echo
'1'
;
}
|
XMLhttpReuest.js
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
|
function
ajaxFunction()
{
var
xmlHttp;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=
new
XMLHttpRequest();
}
catch
(e)
{
// Internet Explorer
try
{
xmlHttp=
new
ActiveXObject(
"Msxml2.XMLHTTP"
);
}
catch
(e)
{
try
{
xmlHttp=
new
ActiveXObject(
"Microsoft.XMLHTTP"
);
}
catch
(e)
{
alert(
"您的浏览器不支持AJAX!"
);
return
false
;
}
}
}
return
xmlHttp;
}
|