1 JS文件：
2 var FileName = "";
3 var FileStr = "";
4 (function () {
5 function $id(id) {
6 return document.getElementById(id);
7 }
8 function Output(msg) {
9 var m = $id("filedrag");
10 m.innerHTML = msg + m.innerHTML;
11 }
12 function FileDragHover(e) {
13 e.stopPropagation();
14 e.preventDefault();
15 e.target.className = (e.type == "dragover" ? "hover" : "");
16 }
17 function FileSelectHandler(e) {
18 FileDragHover(e);
19 var files = e.target.files || e.dataTransfer.files;
20 for (var i = 0, f; f = files[i]; i++) {
21 ParseFile(f);
22 UploadFile(f); //暂时注释
23 }
24 }
25 function ParseFile(file) {
26
27 //pic类型
28 if (file.type.indexOf("image") == 0) {
29 var reader = new FileReader();
30 reader.onload = function (e) {
31 Output(
32 "<p><strong>" + file.name + ":</strong><br />" +
33 '<img src="' + e.target.result + '" /></p>'
34 );
35 FileStr=e.target.result;
36 }
37 reader.readAsDataURL(file);
38 }
39 //文本类型处理
40 if (file.type.indexOf("text") == 0) {
41 var reader = new FileReader();
42 reader.onload = function (e) {
43 Output(
44 "<p><strong>" + file.name + ":</strong></p><pre>" +
45 e.target.result.replace(/</g, "<").replace(/>/g, ">") +
46 "</pre>"
47 );
48 }
49 reader.readAsText(file);
50 }
51 }
52 function uploadProgress(evt) {
53 if (evt.lengthComputable) {
54 var percentComplete = Math.round(evt.loaded * 100 / evt.total);
55 document.getElementById('progressNumber').innerHTML = percentComplete.toString() + '%';
56 }
57 else {
58 document.getElementById('progressNumber').innerHTML = '';
59 }
60 }
61 function UploadFile(file) {
62 $id("filedrag").innerHTML = ""; //清空当前fileDrg的信息
63 if (location.host.indexOf("sitepointstatic") >= 0) return
64 var xhr = new XMLHttpRequest();
65 if (xhr.upload && file.size <= $id("sizebyte").value && file.type == "image/jpeg") {
66 var o = $id("progress");
67 var progress = o.appendChild(document.createElement("p"));
68 // progress.appendChild(document.createTextNode("名称： " + file.name));
69 // xhr.upload.addEventListener("progress", function (e) {
70 // var pc = parseInt(100 - (e.loaded / e.total * 100));
71 // progress.style.backgroundPosition = pc + "% 0";
72 // }, true);
73 xhr.onreadystatechange = function (e) {
74 alert(xhr.readyState);
75 if (xhr.readyState == 4) {
76 progress.className = (xhr.status == 200 ? "success" : "failure");
77 }
78 };
79 var files = file.name;
80 FileName=file.name;
81 }
82 }
83 $("#btnUpload").click(function () {
84 if ($("#fileselect").val() == "") {
85 if(FileStr==""){
86 alert("请选择一个图片文件，再点击上传。");
87 return;
88 }else{
89 $.post(
90 "SaveServer.ashx",
91 {FileStr:FileStr},
92 function(data){
93 alert("成功");
94 $("#fileselect").val("");
95 });
96 }
97 }else{
98 $.post(
99 "SaveServer.ashx",
100 {FileStr:FileStr},
101 function(data){
102 alert("成功");
103 $("#fileselect").val("");
104
105 });
106 }
107
108 });
109 function Init() {
110 var hh = this;
111 var fileselect = $id("fileselect"),
112 filedrag = $id("filedrag")/
113 fileselect.addEventListener("change", FileSelectHandler, false);
114
115 var xhr = new XMLHttpRequest();
116 if (xhr.upload) {
117
118 filedrag.addEventListener("progress", uploadProgress, false);
119 filedrag.addEventListener("dragover", FileDragHover, false); //如果鼠标移动但停留在同一个控件中，则引发DragOver事件
120 filedrag.addEventListener("dragleave", FileDragHover, false); //如果用户移出一个窗口，则引发DragLeave事件
121 filedrag.addEventListener("drop", FileSelectHandler, false); //完成拖放操作
122 filedrag.style.display = "block";
123 upButton.style.display = "block";
124 }
125
126 }
127 if (window.File && window.FileList && window.FileReader) {
128 Init();
129 } else {
130 upButton.style.display = "block";
131 alert("您的浏览器不支持File API");
132 }
133 })();
后台接受页面：
context.Response.ContentType = "text/plain";
string[] aa = context.Request.Form["FileStr"].Split(',');
MemoryStream ms = new MemoryStream(Convert.FromBase64String(aa[1]));
Bitmap b = new Bitmap(ms);
string serverPath = System.Web.HttpContext.Current.Server.MapPath("~");
string toFilePath = Path.Combine(serverPath, @"images\headimg\");
string pach = toFilePath + GetImageName() + ".jpg";
b.Save(pach);
context.Response.Write("yes");
context.Response.End();
