js获取判断上传文件后缀名的示例代码

代码如下:

function lastname(){
 //获取欲上传的文件路径
var filepath = document.getElementById("file1").value;
//为了避免转义反斜杠出问题，这里将对其进行转换
var re = /(\\+)/g;
var filename=filepath.replace(re,"#");
//对路径字符串进行剪切截取
var one=filename.split("#");
//获取数组中最后一个，即文件名
var two=one[one.length-1];
//再对文件名进行截取，以取得后缀名
var three=two.split(".");
 //获取截取的最后一个字符串，即为后缀名
var last=three[three.length-1];
//添加需要判断的后缀名类型
var tp ="jpg,gif,bmp,JPG,GIF,BMP";
//返回符合条件的后缀名在字符串中的位置
var rs=tp.indexOf(last);
//如果返回的结果大于或等于0，说明包含允许上传的文件类型
if(rs>=0){
 return true;
 }else{
 alert("您选择的上传文件不是有效的图片文件！");
 return false;
  }
}

备注说明：
1.先将该脚本保存成一个JS文件，然后包含到上传文件的页面当中；
2.在上传页面的表单中加入onsubmit="return lastname()"

赞 (0)

相关推荐

  • js获取上传文件的绝对路径实现方法

    在html中 <input type="file" id="importFile" /> <input type="button" onclick="upload()"/> <script> function upload() { var filename = document.getElementById("importFile").value; // 这时的filen

  • 利用javascript/jquery对上传文件格式过滤的方法

    复制代码 代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <style><!-- .errorInfo{ color:red; padding-left:5px; } --></style><s

  • nodejs 实现模拟form表单上传文件

    nodejs 实现模拟form表单上传文件

    以前项目里有这个方法,最近在客户那里出问题了,同事说,这个方法从来就没管用过,SO,用了一天时间把这个方法给搞出来了(觉得花费的时间长了点),分享之. 代码及测试用例: var http = require('http'); var path = require('path'); var fs = require('fs'); function postFile(fileKeyValue, req) { var boundaryKey = Math.random().toString(16);

  • file控件选择上传文件确定后触发的js事件是哪个

    一直以来纠结于这个问题.今天闲来上网搜索了一下这个问题.终于知道答案.是onchange事件.经过本人测试,可用.还有说onpropertychange也可以.经chrome浏览器测试,无效果.不知道是什么原因.

  • JS中使用FormData上传文件、图片的方法

    关于FormData XMLHttpRequest Level 2添加了一个新的接口  ---- FormData 利用FormData对象,可以通过js用一些键值对来模拟一系列表单控件,可以使用XMLHttpRequest的 send( ) 方法来异步提交表单与普通的ajax相比,使用FormData的最大优点就是可以异步上传二进制文件 FormData对象 FormData对象,可以把所有表单元素的name与value组成一个queryString,提交到后台. 在使用ajax提交时,使用F

  • 一个简单的jQuery插件ajaxfileupload.js实现ajax上传文件例子

    jQuery插件AjaxFileUpload可以实现ajax文件上传,该插件使用非常简单,首先了解一下正确使用AjaxFileUpload插件的方法,然后再了解一些常见的错误信息和解决方法. 使用说明 需要使用jQuery库文件 和AjaxFileUpload库文件 使用实例 一,包含文件部分 复制代码 代码如下: <script type="text/javascript" src="jquery.js"></script> <scr

  • JavaScript检测上传文件大小的方法

    本文实例讲述了JavaScript检测上传文件大小的方法.分享给大家供大家参考.具体如下: 通过JS客户端代码限制用户上传文件的大小,但是客户端的验证只是辅助的,服务器端一定还要再做验证 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http

  • 原生JS上传大文件显示进度条 php上传文件代码

    原生JS上传大文件显示进度条 php上传文件代码

    JS原生上传大文件显示进度条,php上传文件,供大家参考,具体内容如下 在php.ini修改需要的大小: upload_max_filesize = 8M    post_max_size = 10M    memory_limit = 20M <!DOCTYPE html> <html> <head> <title>原生JS大文件显示进度条</title> <meta charset="UTF-8"> <s

  • JSP上传文件到指定位置实例代码

    Servlet 代码: 复制代码 代码如下: /** 直接取上传的File */ public void doPost(HttpServletRequest request, HttpServletResponse response)   throws ServletException, IOException {  String targetPath = request.getRealPath(request.getContextPath()); // 目标存储路径,服务器部署目录下  req

  • 使用ajaxfileupload.js实现ajax上传文件php版

    无论是PHP,还是其他的服务端脚本都提供了文件上传功能,实现起来也比较简单.而利用JavaScript来配合,即可实现Ajax方式的文件上传.虽然jQuery本身没有提供这样的简化函数,但有不少插件可以实现.其中,Phpletter.com提供的ajaxfileupload.js是一个轻量的插件,而且编写方式与jQuery提供的全局方法$.post()非常相似,简单易用. 不过,该插件实在太简化了,除了可提供需上传文件的路径外,也就不能传递额外的值到后台服务端.所以,我修改了一下该脚本,增加个一

随机推荐