cngolon
cngolon

jquery验证上传文件样式及大小(好用)

<!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("上传的图片大小不能超过10M！");
                    } else {
                        var num01 = file_size / 1024;
                        num02 = num01.toFixed(2);
                        $("#fileSize").text(num02 + " KB");
                    }
                }
                return true;
            });
        });
    </script>
    <title>无标题文档</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>

你可能感兴趣的:(文件上传,jquery验证)

  • 请简单介绍一下Shiro框架是什么？Shiro在Java安全领域的主要作用是什么？Shiro主要提供了哪些安全功能？ AaronWang94 shirojavajava安全开发语言
    请简单介绍一下Shiro框架是什么？Shiro框架是一个强大且灵活的开源安全框架，为Java应用程序提供了全面的安全解决方案。它主要用于身份验证、授权、加密和会话管理等功能，可以轻松地集成到任何JavaWeb应用程序中，并提供了易于理解和使用的API，使开发人员能够快速实现安全特性。Shiro的核心组件包括Subject、SecurityManager和Realms。Subject代表了当前与应用
  • #D174-读书会作业-《财务自由之路》3 白洲笔记
    最近沉迷于写作营，一直就没时间去弄读书会的作业，书的第二遍也就看了个开头，趁着日更的时间，赶紧把作业做了，这次是15到21课。【1.印象最深刻的部分】(本周所读内容中印象最深刻的部分)*活在未来，最正确的方法是什么？用正确的方法做正确的事情，判断什么是正确的？逻辑。学会思考。"作对事情"永远比“把事情作对“重要的多。”长远思考，耐心验证，小心总结提炼“证明自己正确并不是学习的任务和目标，时刻成长，
  • Django forms组件 在飞行-米龙 Djangodjangopython后端
    【一】引入【1】实现登陆验证功能（1）需求分析登陆验证需要前后端交互，采用form表单提交数据对数据进行校验用户名必须以英文大写字母开头密码必须大于三位数反馈给用户错误的信息除了反馈错误的信息还有保留原始输入内容（2）后端代码使用user_info_dict字典每次刷新存储存储前端发送的信息存储后端进行验证的信息defhome(request):#每次后刷新这个信息字典user_info_dict
  • Vue 常见面试题(一) 安生生申 面试题vue.js前端javascript
    目录1、Vue的最大的优势是什么？（必会）2、Vue和jQuery两者之间的区别是什么？（必会）3、MVVM和MVC区别是什么？哪些场景适合？（必会）1、基本定义2、使用场景3、两者之间的区别4、Vue数据双向绑定的原理是什么?（必会）5、Object.defineProperty和Proxy的区别（必会）6、Vue生命周期总共分为几个阶段？（必会）7、第一次加载页面会触发哪几个钩子函数？（必会）
  • 计算机常用端口号 王依硕 linux服务器ssh
    ftp：（20端口）用于ftp服务，用于数据传输。ftp：（21端口）用于文件上传和下载。ssh：（22端口）用于安全Shell访问和文件传输。telnet：（23端口）用于远程命令行计算机管理。smtp：（25端口）用于发送电子邮件。dns：（53端口）用于域名解析。dhcp：（67和68端口）用于动态分配IP地址和配置网络参数。tftp：（69端口）使用udp连接。finger：（79端口）是
  • 4D习书——第三章 李晓廲
    这一章主要是介绍4D坐标的产生背景，介绍了4D系统分析领导力，并对其进行了验证。图片发自AppA正确的坐标系能把一个不可能解决的问题，变成两个可以解决的难题。M我的感觉是顿悟，我思考的是不可能的问题可以分开为几个能被解决的问题，就是分解，也就是各个击破。B对于我来说，定一个比较不易达到的目标，感觉实际实践起来应该很不容易，但是我可以分解成几个容易实现的目标。对孩子的学习辅导也是一样的，要培养孩子的
  • CDH 启停使用HiveServer2 金刚_30bf
    翻译：https://www.cloudera.com/documentation/enterprise/latest/topics/cdh_ig_hiveserver2_start_stop.html版本：5.14.2HiveServer2是HiveServer的改进版本，支持Kerberos身份验证和多客户端并发访问。您可以使用Beeline客户端访问HiveServer2。警告：如果以远程模
  • list分组，多线程处理数据入库 墨玉加菲 java后端javaspring
    需求：解析上传的文件，将文件里的数据放入到list后，验证数据，符合条件的数据入库，分组多线程处理数据，有异常回滚事务（这里使用的是手动事务）先贴代码，这是业务代码packagecom.sh.service.test.impl;importcom.baomidou.mybatisplus.extension.service.impl.ServiceImpl;importcom.sh.constan
  • vue时间组件：dayjs与moment 煸橙干儿~~ VUE实战vue.js前端javascript
    一、dayjs使用Day.js是一个极简的JavaScript库，可以为现代浏览器解析、验证、操作和显示日期和时间。具体使用可参考：dayjs官网1、本年start=dayjs().startOf('year').format('YYYY-MM-DD')end=dayjs().endOf('year').format('YYYY-MM-DD')console.log(start,end)//['2
  • 解决el-input无法输入的问题和表单验证失败问题 颖儿♡＾▽＾♡ vueelement-uivue.jsjavascriptelementui
    el-input无法输入的问题和表单验证失败问题原因1、el-input组件没有绑定双向响应式数据(v-model)解决方案:在data中定义一个变量，然后在el-input组件中使用v-model进行双向数据绑定，这样子就会解决el-input组件无法输入的问题了。原因2、组件嵌套太深(具体原因不清楚，只知道解决方法)有时，你会发现我们进行了双向数据绑定了，但是el-input还是无法输入，我们
  • .net core Program.cs中读取appsettings.json路径读取错误问题 L*先生 .net.netcore
    在.netcore3.1中遇到读取appsettings.json路径读取错误问题.在.netcore3.1中使用以下语句读取，其中第一条验证可用，其他未验证过。3.1比较特殊，其他版本似乎没有这个问题.1.验证可用varconfiguration=newConfigurationBuilder().SetBasePath(Environment.CurrentDirectory).AddJson
  • 网页有效防止XSS,SQL注入,木马文件拦截上传等安全问题 程序员贵哥 网络安全xsssql安全网络安全web安全php
    网络安全问题一直是备受关注的话题，其中跨站脚本攻击（XSS）、SQL注入和木马文件上传是常见的安全威胁。下面我将详细介绍这些安全问题。首先是跨站脚本攻击（XSS）。XSS攻击是一种利用网站漏洞，将恶意脚本注入到用户浏览器中并执行的攻击方式。攻击者可以在网站中插入恶意脚本，当用户浏览该网站时，恶意脚本会被执行，从而窃取用户的敏感信息或执行其他恶意操作。XSS攻击可以分为反射型、存储型和DOM-bas
  • C++面试题和笔试题（五）-手撕代码篇 虾仁A c++算法
    一、编程题给定一个字符串，验证它是否是回文串，只考虑字母和数字字符，可以忽略字母的大小写。说明：本题中，我们将字符串定义为有效的回文串示例1：输入：‘Aman,apla,acanal:Panama"输出：true解释：“amanaplanacanalpanama"是回文串示例2：输入：“raceacar"输出：false解释："raceacar"不是回文串提示：1#include#includeu
  • JS的设计模式（23种） 是个车迷 JavaScriptjavascript设计模式开发语言
    JavaScript设计模式是指在JavaScript编程中普遍应用的一系列经过验证的最佳实践和可重用的解决方案模板，它们用来解决在软件设计中频繁出现的问题，如对象的创建、职责分配、对象间通信以及系统架构等。设计模式并不特指某个具体的代码片段，而是一种描述在特定上下文中如何组织程序结构和对象交互的通用指导原则。JavaScript设计模式涵盖了创建型模式（处理对象创建的方式）、结构型模式（关注对象
  • vue3 + Element + nodejs 大文件上传、断点续传 ZL随心 vue.js前端javascript
    前言大文件上传，一般时间都比较长，这么长的时间内，可能会出现各种各样的问题，比如断网，一旦出错，我们的文件就需要重新上传，这样造成资源浪费，如果我们使用了断点续传继续就不会造成资源浪费了，因为当出现错误的时候，我们再重新上传文件，就会从我们出现错误的地方开始上传了，对于出错前上传的内容就不用再上传了，对于已经上传过的文件，就可以实现秒传的效果了。完整仓库地址流程1、上传方法constonUploa
  • 有趣的DNA聚合酶 临窗听风雨
    UniPort数据库登记的DNA聚合酶被实验证实的都有1000多种，想要都介绍恐怕得写一本书。我选择了三个比较有趣的来聊一聊：它可以不依赖引物，仅在一种叫做末端蛋白的辅助下，起始DNA的复制。可以不依赖模板进行DNA合成的聚合酶。能够在无引物情况下进行DNA合成的聚合酶。Phi29DNAPolymerasePhi29DNAPolymerase（后面简称Phi29）是从枯草芽孢杆菌phi29噬菌体基
  • 突破编程_C++_高级教程（单元测试与 Google Test 教程） breakthrough_01 突破编程_C++_高级教程c++单元测试开发语言
    1单元测试简介单元测试（UnitTesting）是一种编程方法，用于验证代码中的最小可测试单元（通常是函数、方法或模块）是否按照预期工作。在C++中，单元测试通常涉及编写一组测试用例，每个用例都调用一个特定的函数或方法，并验证其返回值或行为是否符合预期。单元测试的目的是确保代码的正确性和可靠性，以及减少在后续开发过程中引入错误的可能性。通过编写单元测试，开发人员可以在不影响其他代码的情况下，独立地
  • [套路] 浏览器引入Vue.js场景-WangEditor富文本编辑器的使用 (永久免费) Grandpa_Rick 套路frontendvue.js前端javascriptwangEditor
    系列文章目录[套路]el-table多选属性实现单选效果[套路]基于服务内存实现的中文拼音混合查询[套路]Bypass滑块验证码目录系列文章目录前言一、实现1.1场景1.2Window对象简介1.3引入WangEditor1.4页面配置前言公司使用freemarker的老旧SpringBootWeb后台项目,前两年通过浏览器引入js的方式使用Vue简单升级了下,方便迭代功能.近期一个很简单的功能需
  • accessToken 星梦清河 javaspringboot经验分享redis
    1、介绍accessToken，通常是用于身份验证和授权的令牌,它可以用于前端和后端，具体使用方式取决于应用程序的架构和需求。前端应用accessToken通常用于向后端API发送请求时进行身份验证和授权。（1）前端应用程序会在用户登录成功后获取accessToken；（2）并将accessToken存储在本地;（3）然后在每次请求API时，将accessToken作为请求头或参数发送给后端；（4
  • php短信验证码登录实现 短信接口开发
    本文为您提供了PHP语言版本的验证码短信接口对接DEMO示例//接口类型：互亿无线触发短信接口，支持发送验证码短信、订单通知短信等。//账户注册：请通过该地址开通账户http://user.ihuyi.com/?DKimmu//注意事项：//（1）调试期间，请使用用系统默认的短信内容：您的验证码是：【变量】。请不要把验证码泄露给其他人。//（2）请使用APIID及APIKEY来调用接口，可在会员中
  • 面试复盘（北京某小公司） 无所畏惧的man 面经面试职场和发展
    北京某小公司一面复盘先和面试官做了自我介绍，然后他问了我的一些基本情况。然后开始问项目问：谈一谈项目中有哪些亮点？我用redis来做验证码的缓存，当用户登录时，刷新得到验证码，验证码会被放到redis当中，key为生成的随机字符串，value即为言验证码内容，在cookie当中也会存储这个字符串，当用户提交表单时，后端会取到cookie的值，然后从reids缓存中根据key取到验证码的值进行判断即
  • 登录页面用户名和密码怎么连接服务器使用服务器数据 独木人生 运维服务器运维
    要连接服务器并使用服务器数据，通常需要通过网络协议与服务器进行通信。以下是一般的步骤：在登录页面，用户输入用户名和密码。前端代码将用户名和密码发送到服务器。可以使用AJAX或表单提交等技术。服务器接收到用户名和密码后，可以通过数据库查询等方式验证用户身份。如果验证通过，服务器可以返回一个身份令牌（如使用JSONWebTokens），作为用户的登录凭证。前端代码保存这个身份令牌，并在后续的请求中发送
  • vue+elementUI用户修改密码的前端验证 zj_zjk_sjz vue.js前端elementuijavascript
    用户登录后修改密码，密码需要一定的验证规则。旧密码后端验证是否正确；前端验证新密码的规范性，新密码规范为：6-16位，至少含数字/字母/特殊字符中的两种；确认密码只需要验证与新密码是否一致；弹窗结构取消确认form验证规则passRules:{oldPassword:[{required:true,message:'请输入旧密码',trigger:'blur'}],newPassword:[{va
  • PHP对接验证码短信接口DEMO示例 樱桃桃
    学习编程得第N天，发现一个超简单验证码短信接口对接DEMO示例步骤1.注册互亿无线账号2.查找APIID和APIKEY3.代码的书写注册互亿无线账号网站：http://user.ihuyi.com/?JA9Ewr查找APIID和APIKEY注意事项：（1）调试期间，请使用用系统默认的短信内容：您的验证码是：【变量】。请不要把验证码泄露给其他人。//开启SESSIONsession_start();
  • 设计之魅：高质量面向对象设计的秘密 JAVA新视界 java开发语言算法
    设计模式是在软件设计中用于解决常见问题的经过验证的解决方案。设计模式并不是代码或库，而是一种解决问题的思考方式。在使用设计模式时，需要考虑一些基本的设计原则，这些原则有助于构建灵活、可维护和可扩展的软件系统。以下是一些常见的设计原则：单一职责原则（SingleResponsibilityPrinciple-SRP）:它指导我们确保一个类只有一个责任。类的责任应该是单一的，即一个类应该只有一个引起它
  • spring boot 验证码源代码，直接复制使用 古猿写代码 springbootspringbootjava前端
    使用springboot实现验证码源代码，直接复制使用publicvoidgetCodeImage(HttpServletResponseresponse){//随机生成4位验证码RandomGeneratorrandomGenerator=newRandomGenerator("0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVW
  • WEB界面jquery1.7.2版本升级到jquery3.6版本需要注意的问题 程序十八大 javascriptjqueryjavascripthtml
    $.size();需要更改为$.length;原因：1.8版本的时候$.size()被废弃页面加载的时候，$(function(){})与onload=""谁先执行的问题。
  • 力扣L12--- 125验证回文串（java版）-2024年3月15日 豆沙沙包? leetcode算法leetcodejavapython
    1.题目2.知识点注1：在Java中，toString()方法用于将对象转换为字符串表示形式。对于数组对象，toString()方法将返回数组的字符串表示形式，其中包含数组中每个元素的字符串表示形式，以逗号分隔，并且包含在方括号中。//toString字符变成字符串//测试示例char[]s={'H','e','l','L','o'};solution.toLowerCase(s);System.
  • ETH网络权益证明（PoS） 面向Web3，春暖花开 深入了解ETH一步步了解Web3web3区块链
    权益证明-POS权益证明是一种证明验证者已经将有价值物品质押到网络上的方法。如果验证者有失信行为，这些物品可能会被销毁。在以太坊的权益证明机制下，验证者明确地通过以太币将资产质押到以太坊上的智能合约中。之后，验证者负责检查在网络上传播的新区块是否有效，偶尔自己也创建和传播新区块。当他们试图欺骗网络（例如，在应该发送一个区块时提出多个区块，或者发送冲突的认证）时，他们质押的部分或全部以太币可能会被销
  • ubuntu20.04下安装anaconda+配置环境变量+运行+创建快捷方式 Terry Cao 漕河泾 ubuntulinux
    原来是在windows下用matlab进行数据处理与算法验证，在ubuntu下进行C++部署应用，需要不断的重启切换双系统，太麻烦，打算在ubuntu下用python进行数据处理与算法验证。安装anaconda如下1.官网下载anacondaFreeDownload|Anaconda2.安装，在文件夹下打开命令窗口，输入bashAnaconda3-2022.10-Linux-x86_64.sh具体
  • 安装数据库首次应用 Array_06 javaoraclesql
    可是为什么再一次失败之后就变成直接跳过那个要求 enter full pathname of java.exe的界面 这个java.exe是你的Oracle 11g安装目录中例如：【F:\app\chen\product\11.2.0\dbhome_1\jdk\jre\bin】下的java.exe 。不是你的电脑安装的java jdk下的java.exe！ 注意第一次，使用SQL D
  • Weblogic Server Console密码修改和遗忘解决方法 bijian1013 Welogic
            在工作中一同事将Weblogic的console的密码忘记了，通过网上查询资料解决，实践整理了一下。 一.修改Console密码         打开weblogic控制台，安全领域 --> myrealm -->&n
  • IllegalStateException: Cannot forward a response that is already committed Cwind javaServlets
    对于初学者来说，一个常见的误解是：当调用 forward() 或者 sendRedirect() 时控制流将会自动跳出原函数。标题所示错误通常是基于此误解而引起的。 示例代码： protected void doPost() { if (someCondition) { sendRedirect(); } forward(); // Thi
  • 基于流的装饰设计模式 木zi_鸣 设计模式
    当想要对已有类的对象进行功能增强时，可以定义一个类，将已有对象传入，基于已有的功能，并提供加强功能。 自定义的类成为装饰类 模仿BufferedReader，对Reader进行包装，体现装饰设计模式 装饰类通常会通过构造方法接受被装饰的对象，并基于被装饰的对象功能，提供更强的功能。 装饰模式比继承灵活，避免继承臃肿，降低了类与类之间的关系 装饰类因为增强已有对象，具备的功能该
  • Linux中的uniq命令 被触发 linux
    Linux命令uniq的作用是过滤重复部分显示文件内容，这个命令读取输入文件，并比较相邻的行。在正常情 况下，第二个及以后更多个重复行将被删去，行比较是根据所用字符集的排序序列进行的。该命令加工后的结果写到输出文件中。输入文件和输出文件必须不同。如 果输入文件用“- ”表示，则从标准输入读取。 AD： uniq [选项] 文件 说明：这个命令读取输入文件，并比较相邻的行。在正常情况下，第二个
  • 正则表达式Pattern 肆无忌惮_ Pattern
    正则表达式是符合一定规则的表达式，用来专门操作字符串，对字符创进行匹配，切割，替换，获取。   例如，我们需要对QQ号码格式进行检验 规则是长度6~12位  不能0开头  只能是数字，我们可以一位一位进行比较，利用parseLong进行判断，或者是用正则表达式来匹配[1-9][0-9]{4,14} 或者 [1-9]\d{4,14} &nbs
  • Oracle高级查询之OVER (PARTITION BY ..) 知了ing oraclesql
    一、rank()/dense_rank() over(partition by ...order by ...) 现在客户有这样一个需求，查询每个部门工资最高的雇员的信息，相信有一定oracle应用知识的同学都能写出下面的SQL语句： select e.ename, e.job, e.sal, e.deptno from scott.emp e, (se
  • Python调试 矮蛋蛋 pythonpdb
    原文地址： http://blog.csdn.net/xuyuefei1988/article/details/19399137 1、下面网上收罗的资料初学者应该够用了，但对比IBM的Python 代码调试技巧： IBM：包括 pdb 模块、利用 PyDev 和 Eclipse 集成进行调试、PyCharm 以及 Debug 日志进行调试： http://www.ibm.com/d
  • webservice传递自定义对象时函数为空，以及boolean不对应的问题 alleni123 webservice
    今天在客户端调用方法 NodeStatus status=iservice.getNodeStatus(). 结果NodeStatus的属性都是null。 进行debug之后，发现服务器端返回的确实是有值的对象。 后来发现原来是因为在客户端，NodeStatus的setter全部被我删除了。 本来是因为逻辑上不需要在客户端使用setter， 结果改了之后竟然不能获取带属性值的
  • java如何干掉指针，又如何巧妙的通过引用来操作指针————>说的就是java指针 百合不是茶
    C语言的强大在于可以直接操作指针的地址，通过改变指针的地址指向来达到更改地址的目的,又是由于c语言的指针过于强大，初学者很难掌握， java的出现解决了c，c++中指针的问题 java将指针封装在底层，开发人员是不能够去操作指针的地址，但是可以通过引用来间接的操作：   定义一个指针p来指向a的地址（&是地址符号）：        
  • Eclipse打不开，提示“An error has occurred.See the log file ***/.log” bijian1013 eclipse
    打开eclipse工作目录的\.metadata\.log文件，发现如下错误： !ENTRY org.eclipse.osgi 4 0 2012-09-10 09:28:57.139 !MESSAGE Application error !STACK 1 java.lang.NoClassDefFoundError: org/eclipse/core/resources/IContai
  • spring aop实例annotation方法实现 bijian1013 javaspringAOPannotation
            在spring aop实例中我们通过配置xml文件来实现AOP，这里学习使用annotation来实现，使用annotation其实就是指明具体的aspect,pointcut和advice。1.申明一个切面(用一个类来实现)在这个切面里,包括了advice和pointcut AdviceMethods.jav
  • [Velocity一]Velocity语法基础入门 bit1129 velocity
    用户和开发人员参考文档 http://velocity.apache.org/engine/releases/velocity-1.7/developer-guide.html   注释 1.行级注释## 2.多行注释#*  *#   变量定义 使用$开头的字符串是变量定义，例如$var1, $var2,   赋值 使用#set为变量赋值，例
  • 【Kafka十一】关于Kafka的副本管理 bit1129 kafka
    1. 关于request.required.acks   request.required.acks控制者Producer写请求的什么时候可以确认写成功，默认是0， 0表示即不进行确认即返回。 1表示Leader写成功即返回，此时还没有进行写数据同步到其它Follower Partition中 -1表示根据指定的最少Partition确认后才返回，这个在   Th
  • lua统计nginx内部变量数据 ronin47 lua nginx　 统计
    server { listen 80; server_name photo.domain.com; location /{set $str $uri; content_by_lua ' local url = ngx.var.uri local res = ngx.location.capture(
  • java-11.二叉树中节点的最大距离 bylijinnan java
    import java.util.ArrayList; import java.util.List; public class MaxLenInBinTree { /* a. 1 / \ 2 3 / \ / \ 4 5 6 7 max=4 pass "root"
  • Netty源码学习-ReadTimeoutHandler bylijinnan javanetty
    ReadTimeoutHandler的实现思路： 开启一个定时任务，如果在指定时间内没有接收到消息，则抛出ReadTimeoutException 这个异常的捕获，在开发中，交给跟在ReadTimeoutHandler后面的ChannelHandler，例如 private final ChannelHandler timeoutHandler = new ReadTim
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他