指引网

当前位置: 主页 > 网页制作 > JavaScript >

js验证上传文件扩展名方法收藏

来源:网络 作者:佚名 点击: 时间:2017-07-02 09:07
[摘要]  js验证用户上传文件类型以及时反应上传的文件是不是我们允许的,从而减少了在用户提交到服务器时才给出提示,实现原理是利用str.split以.分开,然后我们判断数组中的文件后缀

实例1

只能上传jpg图片文件实例

 代码如下 复制代码

<form action="*.jsp" method="post" onsubmit="return check()">
<input type="file" name="file">
<input type="submit" value="上传">
</form>

js代码


function check2()
{
var file = document.getElementsByName("file").value;
if(file=="")
{
alert("请选择文件");
return false;
}
var strTemp = file.split(".");
var strCheck = strTemp[strTemp.length-1];
if(strCheck.toUpperCase()=='JPG')
{
return true;
}else
{
alert('上传文件类型不对!');
return false;
}
}

验证上传文件的扩展名

 代码如下 复制代码

<input type="file" name="file" id="file" onChange="checkFileName(this)">


 function checkFileName(id) {
     var okText = /txt|jpg|xml|zip/i;//这里是允许的扩展名
     var filename = id.value;//得到当前file文件域的值
     var newFileName = filename.split('.'); //这是将文件名以点分开,因为后缀肯定是以点什么结尾的.
     newFileName = newFileName[newFileName.length-1];//这个是得到文件后缀,因为split后是一个数组所以最后的那个数组就是文件的后缀名.newFileName.length为当前的长度,-1则为后缀的位置,因为是从0开始的
     //开始检查后缀
     if (newFileName.search(okText) == -1) {//search如果没有刚返回-1.这个如果newFileName在okText里没有,则为不允许上传的类型. .
         var err=okText.toString();//将正则转为字符
         var errText=err.replace(/^/|/+(.*)/g,"");//用正则替换 / 开头和 /i结束
         var errText=errText.replace(/|/g,",");//用正则把 | 替换成 ,
         alert("请上传为"+errText+"的文件");//提示
         return;
     }

 }

上面的方法都可扩展性比较差,下面我来介绍一个可展示性超强的代码

 代码如下 复制代码

<SCRIPT LANGUAGE="JavaScript">
<!--
// 去左空格
function ltrim(s){
return s.replace( /^s*/, "");
}

// 去右空格
function rtrim(s){
return s.replace( /s*$/, "");
}

// 去左右空格
function trim(s){
return rtrim(ltrim(s));
}

//获取文件扩展名
function get_ext(f_path){
var ext = '';

if(f_path != null && trim(f_path).length > 0){
   f_path = trim(f_path);
   ext = f_path.substring(f_path.lastIndexOf(".") + 1, f_path.length);
}

return ext;
}

//验证文件扩展名
function chk_ext(f_path){
var ext = get_ext(f_path);

//根据需求定制
var accept_ext = new Array("doc", "pdf", "bpm", "jpeg", "jpg", "gif", "ppt", "xls");

var flag = false;

if(ext != ''){
   for(var i=0; i<accept_ext.length; i++){
    if(ext == accept_ext[i])
     flag = true;
   }
}

return flag;
}
//-->
</SCRIPT>

------分隔线----------------------------