django中实现图片的上传功能

首先在后台视图中接收函数：

reqfile = req.FILES['picfile']
        img = Image.open(reqfile)
        img.thumbnail((500,500),Image.ANTIALIAS)#对图片进行等比缩放
        img.save(rollpicturePath,"png")#保存图片

在前台中使用jQuery的正则表达式判断是否为图片：

[javascript] view plaincopy

1. function submit_upload_picture(){   
2. var file = $('file_c').value;   
3. if(!/.(gif|jpg|jpeg|png|gif|jpg|png)$/.test(file)){   
4. alert("图片类型必须是.gif,jpeg,jpg,png中的一种")   
5. }else{   
6. $('both_form').action="file!upload.action";   
7. $('both_form').submit();   
8. $('insert_img').sethtml('<img src="http://images.anjiwu.com/images/loading.gif"/>');   
9. $('display_div').setstyle('display', 'block');   
10. $('upload_div').setstyle('display', 'none');   
11. }   
12. }   

图片类型与大小的验证

[javascript] view plaincopy

1. //实例二   
2. function validate_edit_logo(a){   
3. var file = $('file').value;   
4. if(!/.(gif|jpg|jpeg|png|gif|jpg|png)$/.test(file)){   
5. alert("图片类型必须是.gif,jpeg,jpg,png中的一种")   
6. if(a==1){   
7. return false;   
8. }   
9. }else{   
10. var image = new image();   
11. image.src = file;   
12. var height = image.height;   
13. var width = image.width;   
14. var filesize = image.filesize;   
15. $('beforeend').src=file;   
16. $('div_regi_right').setstyle('display', 'block');   
17. if(width>80 && height>80 && filesize>102400){   
18. alert('请上传80*80像素 或者大小小于100k的图片');   
19. if(a==1){   
20. return false;   
21. }   
22. }   
23. if(a==1){   
24. return true;   
25. }   
26. }   
27. }   

图片预览

[javascript] view plaincopy

1. //实例三   
2. function viewimg(index) {   
3. var name = 'uploadimg' + index;   
4. var imgup = $(name);   
5. var imgpath = getpath(imgup);   
6. var local = imgup.value;   
7. var point = local.lastindexof(".");   
8. //判断上传文件大小   
9. var img = document.createelement("img");   
10. img.src = local;   
11. var filesize = img.filesize;   
12. img.onload = function(){filesize=this.filesize;}   
13. if(img.filesize>5242880){   
14. alert("图片文件过大！");   
15. return false;   
16. }   
17. //判断是否是图片格式   
18. var imgname = imgup.value.substring(imgup.value.lastindexof("."), imgup.value.length);   
19. imgname = imgname.tolowercase();   
20. if ((imgname != ".jpg") && (imgname != ".gif") && (imgname != ".jpeg") && (imgname != ".png") && (imgname != ".bmp")) {   
21. alert("u8bf7u9009u62e9u56feu7247u6587u4ef6uff0cu8c22u8c22!");   
22. imgup.focus();   
23. //清空file里面的值www.3ppt.com   
24. imgup.select();   
25. document.selection.clear();   
26. } else {   
27. //显示图片   
28. document.getelementbyid("sig_preview"+index).innerhtml = "<img src='" + imgpath + "' border=0 width=200 height=150><img src='images/u51.png' width='16' height='14' onclick='delimage(" + index + ");' />";   
29. }   
30. if (index >=3){   
31. var cnt = index + 1;   
32. $("img" + cnt).style.display = "";   
33. }   
34. }