已经9012年了，如果你的网站还通过传统表单上传文件的话，那你简直低到爆了，也别干什么网络开发了，直接面壁去吧。

  本文基于Uploadify异步上传控件来实现多文件异步上传的无刷新机制，用来提高效率和用户体验，由于uploadify基于jquery的，所以确保已经引入了稳定版的Jquery的，另外需要说明的是，uploadify分为闪光版和H5版，鉴于闪光早就已经被淘汰了，所以H5才是我们的选择，但是H5版居然需要收费，下一个要五美刀，我们当然不能当冤大头，可以考虑去下载一个免费的山寨开源版：HTTPS：//github.com/Double-Lv/Huploadify

前端代码：

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
{#loading入js库＃}
 <script src = '{％static“js / jquery-1.12.1.min.js”％}' > </ script> <script src = '{％static“js / jquery。 Huploadify.js“％}” > </ script> 
 

<BODY>

        <input type = “text” value = “100” id = “t1” >   

        <div id = “upload” > </ div> 


    <SCRIPT>

    让name = $ （“＃t1” ）。val （）;
    
    
    var up = $ （'＃upload' ）。Huploadify （{ auto ：false ，
		fileTypeExts ：'*。*' ，
        multi ：true ，
		fileSizeLimit ：99999999999 ，
        showUploadedPercent ：true ，
        formData ：{ 'name' ：'123' }，
		showUploadedSize ：true ，
        removeTimeout ：9999999 ，
        method ：'后”
		 ，
		uploader ：'/ md_admin / upload_img' ，
		onUploadStart ：function （file ）{ 
            console 。日志（文件。名称+ '开始上传' ）; //$("#upload").Huploadify("settings","formData",{'name':'someValue'}）; 
            uploadify_option 。formData = { name ：'0' }; }，
		onInit ：function （obj ）{ 
			console 。log （'初始化' ）;
            
		
			控制台。log （obj ）; }，
		onUploadComplete ：function （file ）{ 
			console 。日志（文件。名称+ '上传完成' ）; }，
		onCancel ：function （file ）{ 
			console 。日志（文件。名称+ '删除成功' ）; }，
		onClearQueue ：function （queueItemCount ）{ 
			console 。
		
		
		log （'有' + queueItemCount + '个文件被删除了' ）; }，
		onDestroy ：function （）{ 
			console 。log （'destroyed！' ）; }，
		onSelect ：function （file ）{ 
			console 。日志（文件。名称+ '加入上传队列' ）; }，
		onQueueComplete ：function （queueData ）{ 
			console 。log （'队列中的文件全部上传完成'
		
		
		，queueData ）; } };
		
	

	
    
    
    </ SCRIPT>



    
</ BODY>

后台视图文件：

1
2
3
4
5
6
7
8
9
10
11
12
13
＃定义上传视图类class UploadTest （查看）：
 

    ＃定义上传方法def post （self ，request ）：＃接收文件，以对象的形式
        img = request 。文件。获得（“文件” ）打印（请求。POST 。获得（'姓名' ，'未收到参数' ）） ＃文件名称是名称属性＃建立文件流对象
        ˚F = 开放（OS ，路径，加入（UPLOAD_ROOT ，“ ' ，img 。名字），
    
        
        
        
        '世行' ）＃写文件遍历图片文件流的块在IMG 。chunks （）：
            f 。写（块）＃关闭文件流
        f 。close （）返回HttpResponse （json 。转储（{ 'status' ：'ok' }，ensure_ascii = False ），content_type = 'application / json' ）

效果

完成