开发者社区> it徐胖子> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

JS判断FileUpload上传类型

简介:
+关注继续查看
 

<head runat="server">
    <script type="text/javascript">
        function Judge() {

            // 获取上传文件名
            var fileupload = document.getElementByIdx_x("FileUpload1");
            var filename = fileupload.value;

           // 获取该文件名的后缀名
           var extend = filename.substring(filename.lastIndexOf(".") + 1);

            // 上传文件提示信息
            var hint = document.getElementByIdx_x("hint");

            if (extend == "") {
                hint.innerHTML = "<span style='color:red'>上传文件不能为空</span>";
            }
            else if (extend != "doc") {
                hint.innerHTML = "<span style='color:red'>必须上传word格式文件</span>";
    

                // 清空上传文件控件的值
               fileupload.outerHTML = fileupload.outerHTML
            }
            else if (extend == "doc") {
                hint.innerHTML = "";
            }
        }
    </script>
</head>

<body>
    <form id="form1" runat="server">
    <div>
        <asp:FileUpload ID="FileUpload1" runat="server"/>
        <input id="btnUpload" type="button" value="上传" onclick="Judge()" />
        <div id="hint"></div>
    </div>
    </form>
</body>
</html>

 

1.关于如何用脚本修改fileupload控件值的问题,

开发环境vs2005,在上传文件时,需要一个取消的按钮来清空type=file的value,而且这个页面上有多个file控件

这个比较麻烦因为file的值本身是不允许用脚本修改的(安全角度考虑)

 

方法1.使用脚本把这个file的input移动到一个form中,然后调用reset,如果有多个这样的input当然还要再移出来.这个方法我不会采用,因为对.net开发者

来讲习惯了一个页面就一个form所有控件都在其中.

 

方法2.这个方法有点投机,就是在脚本中调用
var fileup = document.getElementById(fileid);
fileup.outerHTML = fileup.outerHTML; 这个ie对脚本处理以及展现机制有关

 

方法3.这个主要是在解决ff上的问题时考虑到的,其实就是重新生成了一个id相同的file,这里要注意 name一定也要赋值,否则是很难提交给服务器接受的

 

 

在平时项目开发中会有上传文件的功能,一般在前端会通过JS来判断上传文件是否属于指定的文件类型,如果不属于就将控件值清空! (当然你也可以不清空)

有一种方法可以很简单的装文件上传组件的值清空,代码如下:
var file=document.getElementById("form1:fileupload");
file.outerHTML=file.outerHTML

 

以上方法之能在IE中使用

为了兼容FireFox我们使用下面的方式来清空fileupload控件的值:

<span id='uploadSpan'>
<input type="file">
</span>
<script language="JavaScript">
var html=document.getElementById('uploadSpan').innerHTML;

function resetFile()

{
document.getElementById('uploadSpan').innerHTML=html;
}
</script>
这样就行了,各浏览器都支持的

 

 

参考地址:http://www.cnblogs.com/jhxk/articles/1667803.html

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
JavaScript判断各种资源是否加载完成的方法汇总,资源预加载问题
JavaScript判断各种资源是否加载完成的方法汇总,资源预加载问题
0 0
判断链表中是否又环使用JavaScript解决算法问题
判断链表中是否又环使用JavaScript解决算法问题
0 0
JS进阶-数据类型的判断方式以及转换方式的汇总
本文内容: 介绍了几种常用的数据类型判断方式,并且手写了一个通用的判断方法 强制类型转换和隐式类型转换的常用方法和规则,以及常见的面试题
0 0
JS判断IOS系统版本
JS判断IOS系统版本
0 0
js通过屏幕宽度判断设备类型
js通过屏幕宽度判断设备类型
0 0
js判断浏览器信息
js判断浏览器信息
0 0
盘点JS判断空对象的几大方法
在盘点JS判空方法之前我们先来了解下面的三个方法。
0 0
js条件逻辑判断-德摩根定律
在实际应用中经常会遇到js的大量逻辑判断,各种复杂的逻辑判断
0 0
可视区域判断(js三种方式判断)
可视区域判断(js三种方式判断)
0 0
JS——数据类型/数据类型的检测、判断以及获取
JS——数据类型/数据类型的检测、判断以及获取
0 0
+关注
it徐胖子
IT徐胖子
文章
问答
文章排行榜
最热
最新
相关电子书
更多
Javascript中的函数
立即下载
Javascript异步编程
立即下载
JS零基础入门教程(上册)
立即下载