<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script>
UpLoadFileCheck=function()
{
this.AllowExt=".jpg,.gif,.bmp,.png";//允许上传的文件类型 0为无限制
this.AllowImgFileSize=0;//允许上传文件的大小 0为无限制 单位：KB
this.AllowImgWidth=300;//允许上传的图片的宽度 0为无限制 单位：px
this.AllowImgHeight=300;//允许上传的图片的高度 0为无限制 单位：px
this.ImgObj=new Image();
this.ImgFileSize=0;
this.ImgWidth=0;
this.ImgHeight=0;
this.FileExt="";
this.ErrMsg="";
this.IsImg=false;
}
UpLoadFileCheck.prototype.CheckExt=function(obj)
{
this.ErrMsg="";
this.ImgObj.src=obj.value;
if(obj.value=="")
{
this.ErrMsg="\n请选择一个文件";
}
else
{
this.FileExt=obj.value.substr(obj.value.lastIndexOf(".")).toLowerCase();
if(this.AllowExt!=0&&this.AllowExt.indexOf(this.FileExt)==-1)
{
this.ErrMsg="\n该文件类型不允许上传";
}
}
if(this.ErrMsg!="")
{
this.ShowMsg(this.ErrMsg,false);
return false;
}
else
return this.CheckProperty(obj);
}
UpLoadFileCheck.prototype.CheckProperty=function(obj)
{
if(this.IsImg==true)
{
thisthis.ImgWidth=this.ImgObj.width;
thisthis.ImgHeight=this.ImgObj.height;
if(this.AllowImgWidth!=0&&this.AllowImgWidth<this.ImgWidth)
thisthis.ErrMsg=this.ErrMsg+"\n图片宽度超过限制。请上传宽度小于"+this.AllowImgWidth+"px的文件";
if(this.AllowImgHeight!=0&&this.AllowImgHeight<this.ImgHeight)
thisthis.ErrMsg=this.ErrMsg+"\n图片高度超过限制。请上传高度小于"+this.AllowImgHeight+"px的文件";
}
this.ImgFileSize=Math.round(this.ImgObj.fileSize/1024*100)/100;
if(this.AllowImgFileSize!=0&&this.AllowImgFileSize<this.ImgFileSize)
thisthis.ErrMsg=this.ErrMsg+"\n文件大小超过限制。请上传小于"+this.AllowImgFileSize+"KB的文件";
if(this.ErrMsg!="")
{
this.ShowMsg(this.ErrMsg,false);
return false;
}
else
return true;
}
UpLoadFileCheck.prototype.ShowMsg=function(msg,tf)
{
alert(msg);
}
function c(obj)
{
var d=new UpLoadFileCheck();
d.IsImg=true;
d.AllowImgFileSize=100;
d.CheckExt(obj)
}
</script>
</head>
<body>
<input name="" type="file" onchange="c(this)"/>
</body>
</html>
分享到：
相关推荐
在IT领域，特别是前端开发中，JavaScript（JS）被广泛应用于网页交互与数据验证，其中对上传图片的大小和格式进行验证是常见的需求之一。本文将深入解析如何使用JavaScript进行图片上传前的验证，包括检查图片格式、...
不用IE控件（ActiveXObject）不用 Img属性 上传图片客户端判断大小，javascript获得上传图片的大小 兼容所有浏览器，亲测可用 判断文件大小，判断上传图片的大小，图片格式
它不仅讲解了如何验证图像文件格式（限于jpg和png），还提供了关于确认文件大小不超过指定值（这里是5MB）的具体实现步骤。作者给出的实际代码段可以帮助开发者快速集成此功能到项目里。同时提到，在开发过程中为了...
javascript 实现限制上传文件大小
JavaScript特效在网页开发中起着至关重要的作用，特别是在表单验证方面。客户端验证是指在用户提交数据到服务器之前，利用JavaScript在用户浏览器上对输入的数据进行有效性检查，以提高用户体验和减轻服务器负担。...
在IT行业中，前端开发经常会遇到用户上传文件的需求，而对上传文件的格式和大小进行验证是确保系统稳定性和用户体验的重要环节。本知识点主要探讨如何使用JavaScript（js）来验证SWF（Shockwave Flash）文件的格式，...
在本文中，我们将深入探讨如何使用纯JavaScript实现上传图片前的预览功能，并且检查图片的大小，确保兼容性覆盖到IE7至IE10、Firefox以及Chrome等主流浏览器。这个功能对于用户交互体验有着重要的作用，因为它允许...
在现代Web开发中，前端表单验证是一项非常重要的功能，它可以确保用户提交的数据符合预期的格式和规则，从而提高用户体验并减少后端处理无效数据的可能性。本文将详细介绍一个用户注册页面中的JavaScript验证逻辑，...
- **原因**：不同的图片格式有不同的特点，例如JPEG适合照片，PNG适合透明背景等。此外，某些格式可能包含恶意代码，限制类型可提高安全性。 - **常见格式**：常见的图片格式有JPEG (.jpg, .jpeg)，PNG (.png)，...
javaScript检测图片大小,检测图片的大小，尺寸
JavaScript是一种广泛应用于网页和网络应用开发的脚本语言，它主要负责在客户端处理网页的动态交互和数据验证。本文将深入探讨JavaScript客户端验证和页面特效制作的核心知识点。 **一、JavaScript客户端验证** ...
JavaScript提供了一种便捷的方式来进行实时验证，如检查空字段、邮箱格式、电话号码格式等。 二、基本的JavaScript验证函数 1. `required`：检查字段是否为空，通常配合HTML5的`<input required>`属性使用。 2. `...
为了提供良好的用户体验和系统安全性，开发者需要在用户上传图片前进行格式验证，确保图片符合规定的格式，并提供预览功能，让用户在提交前能查看上传效果。本文将详细讲解如何使用JavaScript（JS）在客户端实现这一...
JavaScript是Web开发中不可或缺的一部分，尤其在前端交互和数据验证方面扮演着重要角色。本文将深入探讨"javascript表单验证方式一"，介绍如何利用JavaScript进行表单验证，确保用户输入的数据符合预设规则，提高...
比较实用的javascript做的表单验证，验证的表单域包括用户名、密码、密码...表单域基本通过获得焦点显示提示信息，失去焦点进行验证，还有提交表单验证。提交表单先进行必填项不能为空验证，再进行正则表达式匹配验证。
在网页开发中，表单验证是一项至关重要的任务，它确保用户输入的数据符合预期的格式和规则，从而提高用户体验并减少服务器端的压力。本资源"基于JavaScript的表单验证.zip"提供了一种使用JavaScript进行表单验证的...
在这个"JavaScript正则验证手机格式Demo"中，我们将探讨如何利用JavaScript的正则表达式功能来验证输入的字符串是否符合中国大陆手机号码的标准格式。 中国大陆的手机号码通常由11位数字组成，且以1开头，常见的有...
JavaScript客户端输入验证是Web开发中不可或缺的一环，它主要用于在用户提交数据到服务器之前检查数据的有效性和格式。这种验证可以防止无效数据的提交，减轻服务器的负担，提高用户体验，因为错误提示可以即时显示...
本主题将探讨如何使用jQuery和纯JavaScript实现客户端验证，包括图片轮换、Tab切换、图片上下滚动以及表单验证。 首先，jQuery是一个轻量级的JavaScript库，它使得JavaScript的使用更加简洁和高效。在图片轮换功能...
本篇将详细介绍如何在`.NET MVC`框架下，结合`HTML`、`JavaScript`（简称Js）和`jQuery`（简称JQ）实现"上传图片预览"功能，并限制上传的图片格式和大小。 首先，我们需要在前端页面创建一个`HTML`表单，包含一个`...