jquery實(shí)現(xiàn)上傳文件大小類(lèi)型的驗(yàn)證例子(推薦)

更新時(shí)間：2016年06月25日 10:54:38 投稿：jingxian

下面小編就為大家?guī)?lái)一篇jquery實(shí)現(xiàn)上傳文件大小類(lèi)型的驗(yàn)證例子(推薦)。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨想過(guò)來(lái)看看吧

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <script src="jquery1.8/jquery-1.8.0.js" type="text/javascript"></script>
  <script type="text/javascript">
    $(document).ready(function () {
      $("#myFile").change(function () {
        var filepath = $("input[name='myFile']").val();
        var extStart = filepath.lastIndexOf(".");
        var ext = filepath.substring(extStart, filepath.length).toUpperCase();
        if (ext != ".BMP" && ext != ".PNG" && ext != ".GIF" && ext != ".JPG" && ext != ".JPEG") {
          alert("圖片限于bmp,png,gif,jpeg,jpg格式");
          $("#fileType").text("")
          $("#fileSize").text("");
          return false;
        } else { $("#fileType").text(ext) }
        var file_size = 0;
        if ($.browser.msie) {
          var img = new Image();
          img.src = filepath;
          while (true) {
            if (img.fileSize > 0) {
              if (img.fileSize > 3 * 1024 * 1024) {
                alert("圖片不大于100MB。");
              } else {
                var num03 = img.fileSize / 1024;
                num04 = num03.toFixed(2)
                $("#fileSize").text(num04 + "KB");
              }
              break;
            }
          }
        } else {
          file_size = this.files[0].size;
          var size = file_size / 1024;
          if (size > 10240) {
            alert("上傳的圖片大小不能超過(guò)10M！");
          } else {
            var num01 = file_size / 1024;
            num02 = num01.toFixed(2);
            $("#fileSize").text(num02 + " KB");
          }
        }
        return true;
      });
    });
  </script>
  <title>無(wú)標(biāo)題文檔</title>
</head>
<body>
  <table width="500" cellspacing="0" cellpadding="0">
    <tr>
      <td width="72" id="fileType">
      </td>
      <td width="242">
        <input type="file" name="myFile" id="myFile" />
      </td>
      <td width="184" id="fileSize" class="fileSize">
      </td>
    </tr>
  </table>
</body>
</html>

以上就是小編為大家?guī)?lái)的jquery實(shí)現(xiàn)上傳文件大小類(lèi)型的驗(yàn)證例子(推薦)全部?jī)?nèi)容了，希望大家多多支持腳本之家~

您可能感興趣的文章:

相關(guān)文章

jquery實(shí)現(xiàn)簡(jiǎn)單的彈窗效果
這篇文章主要為大家詳細(xì)介紹了jquery實(shí)現(xiàn)簡(jiǎn)單的彈窗效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2021-10-10
基于JQuery實(shí)現(xiàn)分隔條的功能
這篇文章主要介紹了基于JQuery實(shí)現(xiàn)分隔條的功能的相關(guān)資料，使用JQuery技術(shù)實(shí)現(xiàn)分隔條的功能，感興趣的小伙伴們可以參考一下
2016-06-06
jquery 簡(jiǎn)單的圖片展示效果
今天看到google圖片搜索結(jié)果頁(yè)面，感覺(jué)簡(jiǎn)潔實(shí)用，于是用jquery粗略的模仿了一下再次感覺(jué)到j(luò)query的強(qiáng)大和易用，基本思路初步實(shí)現(xiàn)了，再整合ajax和json，應(yīng)該可以做一個(gè)簡(jiǎn)單的應(yīng)用了 :)
2009-12-12
jQuery 淡入淡出 png圖在ie8下有黑色邊框的解決方法
本文章介紹了，jQuery 淡入淡出 png圖在ie8下有黑色邊框的解決方法，需要的朋友可以參考一下
2013-03-03
jquery獲取元素值的方法(常見(jiàn)的表單元素)
獲取元素值的方法有很多，在本文將為大家詳細(xì)介紹下使用jquery是如何做到的，感興趣的朋友不要錯(cuò)過(guò)
2013-11-11
使用jQuery實(shí)現(xiàn)購(gòu)物車(chē)
這篇文章主要為大家詳細(xì)介紹了使用jQuery實(shí)現(xiàn)購(gòu)物車(chē)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-10-10
jQury Ajax使用Token驗(yàn)證身份實(shí)例代碼
這篇文章主要介紹了jQury Ajax使用Token驗(yàn)證身份實(shí)例代碼,需要的朋友可以參考下
2017-09-09
jQuery自定義添加"$"與解決"$"沖突的方法
這篇文章主要介紹了jQuery自定義添加"$"與解決"$"沖突的方法,介紹了用戶自定義添加“$”擴(kuò)展jQuery功能的方法,以及解決"$"沖突的技巧,需要的朋友可以參考下
2015-01-01
jQuery插件FusionWidgets實(shí)現(xiàn)的Bulb圖效果示例【附demo源碼下載】
這篇文章主要介紹了jQuery插件FusionWidgets實(shí)現(xiàn)的Bulb圖效果,結(jié)合完整實(shí)例形式分析了jQuery使用FusionWidgets插件結(jié)合swf文件載入xml數(shù)據(jù)實(shí)現(xiàn)Bulb圖效果的相關(guān)操作技巧,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下
2017-03-03
瀑布流布局并自動(dòng)加載實(shí)現(xiàn)代碼
Pinterest使用一種新的方式布局取得成功之后，們把他叫做瀑布流，國(guó)內(nèi)現(xiàn)有美麗說(shuō)，蘑菇街，花瓣等代表的網(wǎng)站接下來(lái)為你介紹一個(gè)juqery的插件masonry的使用，感興趣的你可以參考下哈
2013-03-03