1、主要使用ajax formdata
2、如果要做图片上传之前预览还需要blob的数据方式，window.URL.createObjectURL(blob);
下面是js代码，服务器端就可以直接使用php的超全局数据变量，$_FILES来i进行数据的处理。
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="utf-8">
5 <meta http-equiv="X-UA-Compatible" content="IE=edge">
6 <meta name="viewport" content="width=device-width, initial-scale=1">
7 <meta name="description" content="">
8 <meta name="author" content="">
9 <title>uploadify</title>
10 <script type="text/javascript" src="./js/jquery-1.11.1.js"></script>
11 <script type="text/javascript">
12 $(function() {
13 $('#btn').on({
14 click:function() {
15 var ff = new FormData();
16 ff.append('file', $('#upload')[0].files[0])
17 $.ajax({
18 type:'POST',
19 url:'test.php',
20 data:ff,
21 dataType:'json',
22 //processData (默认: true) 默认情况下，通过data选项传递进来的数据，如果是一个对象(技术上讲只要不是字符串)，都会处理转化成一个查询字符串，以配合默认内容类型 "application/x-www-form-urlencoded"。如果要发送 DOM 树信息或其它不希望转换的信息，请设置为 false。
23 processData:false,
24 contentType:false, // 必须false才会自动加上正确的Content-Type
25 success:function(msg) {
26 console.log(msg);
27 }
28 })
29 }
30 })
31
32 $('#upload').on({
33 change:function() {
34 var data = $(this).get(0).files[0];
35 var src = window.URL.createObjectURL(data);
36 $('#prew').attr('src', src);
37 }
38 })
39
40 })
41 </script>
42 </head>
43 <body>
44 <input type="file" id="upload" >
45 <button id="btn">上传图片</button>
46 <br>
47 <img src="" id="prew" style="width:500px;height:400px">
48 </body>
来源：https://www.cnblogs.com/hanpengyu/p/4110615.html