javaScript校验图片大小、格式



1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 2 <html xmlns="http://www.w3.org/1999/xhtml">
 3 <head>
 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 5 <script src="/js/jquery-1.4.2.min.js" type="text/javascript"></script>
 6 <script type="text/javascript">
 7     $(document).ready(
 8             function() {
 9                 $("#form01").change(
10                         function() {
11                             var filepath = $("input[name='myFile']").val();
12                             var extStart = filepath.lastIndexOf(".");
13                             var ext = filepath.substring(extStart,
14                                     filepath.length).toUpperCase();
15                             if (ext != ".BMP" && ext != ".PNG" && ext != ".GIF"
16                                     && ext != ".JPG" && ext != ".JPEG") {
17                                 alert("图片限于bmp,png,gif,jpeg,jpg格式");
18                                 return false;
19                             } else {
20                                 $("#name01").text(ext)
21                             }
22                             var file_size = 0;
23                             if ($.browser.msie) {
24                                 var img = new Image();
25                                 img.src = filepath;
26                                 while (true) {
27                                     if (img.fileSize > 0) {
28                                         if (img.fileSize > 3 * 1024 * 1024) {
29                                             alert("图片不大于100MB。");
30                                         } else {
31                                             var num03 = img.fileSize / 1024;
32                                             num04 = num03.toFixed(2)
33                                             $(".size02").text(num04 + "KB");
34                                         }
35                                         break;
36                                     }
37                                 }
38                             } else {
39                                 file_size = this.files[0].size;
40                                 console.log(file_size / 1024 / 1024 + " MB");
41                                 var size = file_size / 1024;
42                                 if (size > 10240) {
43                                     alert("上传的文件大小不能超过10M！");
44                                 } else {
45                                     var num01 = file_size / 1024;
46                                     num02 = num01.toFixed(2)
47                                     $("#size01").text(num02 + " KB");
48                                 }
49                             }
50                             return true;
51                         });
52             });
53 </script>
54 <title>无标题文档</title>
55 </head>
56 <body>
57     <table width="500" cellspacing="0" cellpadding="0">
58         <tr>
59             <td width="72" id="name01"></td>
60             <td width="242"><input type="file" name="myFile" id="form01" /></td>
61             <td width="184" id="size01" class="size02"></td>
62         </tr>
63     </table>
64 </body>
65 </html>

相关阅读:
RobotFramework下的http接口自动化Get关键字的使用
 通过添加filter过滤器彻底解决ajax 跨域问题
 TestLink和RedMine的集成
 SonarQube和Maven的集成
 RobotFramework下的http接口自动化Create Http Context关键字的使用
 正负数的源码反码补码转
 SSM的，日常错误
 SSM的日常错误之 mybatis
Eclipse无法启动报An internal error occurred during: "reload maven project". java.lang.NullPointerException
错误异常
原文地址：https://www.cnblogs.com/shinubi/p/4418588.html