zoukankan html css js c++ java

控制图片的上传格式及显示

 1 $(document).on("change","#files",function(e){
 2     
 3      //获得文件信息
 4         fileInfo = e.target.files[0];
 5         if (fileInfo) {
 6             var fileData = {
 7                 Name: fileInfo.name,
 8                 Size: fileInfo.size,
 9                 Time: new Date(),
10             }
11 
12             var fileImgNameArray = fileData.Name.split(".");
13             var imgUrl = "";
14             //判断后缀后执行的方法
15             switch (fileImgNameArray[fileImgNameArray.length-1]) {
16                 case "jpg":
17                 case "png":
18                     imgUrl = window.URL.createObjectURL(fileInfo);
19                     break;
20                 case "doc":
21                 case "docx":
22                     imgUrl = "../../Images/word.png";
23                     break;
24                 case "txt":
25                     imgUrl = "../../Images/txt.png";
26                     break;
27                 case "rar":
28                     imgUrl = "../../Images/ico_rar.png";
29                     break;
30                 case "apk":
31                     imgUrl = "../../Images/ico_apk.png";
32                     break;
33                 case "ppt":
34                     imgUrl = "../../Images/ppt.png";
35                     break;
36                 case "pdf":
37                     imgUrl = "../../Images/PDF.png";
38                     break;
39                 case "xlsx":
40                     imgUrl = "../../Images/xlsx.png";
41                     break;
42                 default:
43                     imgUrl = "../../Images/ico__.png";
44                     
45             }
46             fileData.Url = imgUrl;
47             // var ok = showfileImg(fileData);
48             var showFile = $('<div class="file">'
49                    + ' <div class="fileInfo">'
50                        + ' <div class="fileImg"><img src="' + fileData.Url + '" /></div>'
51                        + ' <div class="fileDescribe">'
52                            + ' <div class="fileName">' + fileData.Name
53                            + '</div>'
54                            
55                    + ' </div>'
56                    + '<div class="delFile icon-action_delete"></div>'
57                 + '</div>')
58 
59             showFile.appendTo($(".getImg").html(""));
60             $(".tip").addClass("hideInfo");
61         }
62 })

1 <body>
2     <div class="getImg"></div>
3     <input type="file" id="files" />
4 </body>

查看全文

相关阅读:
topcoder srm 495 div1
topcoder srm 500 div1
topcoder srm 485 div1
topcoder srm 490 div1
IDEWorkspaceChecks.plist文件是干什么用的？
博客推荐
 如何使用U盘安装macOS high Sierra?
小程序--模板消息调研
 小程序--剖析小程序上传文件
 小程序--小程序开发过程中遇到的问题以及解决方案

原文地址：https://www.cnblogs.com/sunnie-cc/p/6549638.html