选择文件框如何限制文件类型，比如只显示.txt

huangwenhuan 2009-05-06 06:41:09

<input type="file">选择文件框如何限制文件类型，比如只显示.txt

...全文

22897 18 打赏收藏转发到动态举报

写回复

用AI写文章

18 条回复

切换为时间正序

请发表友善的回复…

发表回复

s478853630 2012-06-12

打赏
举报

你是做java还是asp.net？
如果你做asp.net，最好使用14楼那位大虾的组件
如果你做java，我给你个链接地址：http://download.csdn.net/detail/s478853630/4063293

噢噢噢噢 2012-06-12

打赏
举报

用swfupload吧挺简单

p2227 2012-06-11

打赏
举报

[Quote=引用 11 楼的回复:]

引用 3 楼的回复:
不能在那个弹出来的文件选择框中过滤吗？

你要想在这里过滤，就别用<input type="file">
我这儿有个组件，是这样的：
type表示上传类型，1为图片，2为音频，3为视频，4为flash，0为任何文件
如果你设置type=1，那么在弹出的文件选择框中只能看见图片，其他文件都过滤掉了
如果你设置type=2，就只能选mp3之类的文件，其他类……
[/Quote]你的组件是HTML还是SWF

jackson_fighting 2012-06-11

打赏
举报

onchange 时用js判断或者上传后在后台判断

man648Vip 2012-06-11

打赏
举报

[Quote=引用 11 楼的回复:]
引用 3 楼的回复:
不能在那个弹出来的文件选择框中过滤吗？

你要想在这里过滤，就别用<input type="file">
我这儿有个组件，是这样的：
type表示上传类型，1为图片，2为音频，3为视频，4为flash，0为任何文件
如果你设置type=1，那么在弹出的文件选择框中只能看见图片，其他文件都过滤掉了
如果你设置type=2，就只能选mp3之类的文件，其他类型同……
[/Quote]

组件能发给我吗? 大侠

IT-Style 2012-06-11

打赏
举报

[Quote=引用 13 楼的回复:]

swfupload可以实现你的需求:
http://code.google.com/p/swfupload/
[/Quote]
http://apps.hi.baidu.com/share/detail/15929997

IT-Style 2012-06-11

打赏
举报

swfupload可以实现你的需求:
http://code.google.com/p/swfupload/

s478853630 2012-06-11

打赏
举报

最好是能把腾讯公司在qq空间里上传照片的组件搞到手
那东西却是挺好使的，可惜没办法弄，悲剧！！！

s478853630 2012-06-11

打赏
举报

[Quote=引用 3 楼的回复:]
不能在那个弹出来的文件选择框中过滤吗？
[/Quote]

你要想在这里过滤，就别用<input type="file">
我这儿有个组件，是这样的：
type表示上传类型，1为图片，2为音频，3为视频，4为flash，0为任何文件
如果你设置type=1，那么在弹出的文件选择框中只能看见图片，其他文件都过滤掉了
如果你设置type=2，就只能选mp3之类的文件，其他类型同理
还可以按住[Ctrl]或[Shift]键多选文件，然后多个文件一起上传，不用form提交，无刷新的

黑欧普米 2012-06-06

打赏
举报

http://www.w3school.com.cn/tags/att_input_accept.asp (IE9自带，所以不能正常显示样)

<input type="file" name="pic" id="pic" accept="image/gif, image/jpeg" />

HTML <input> 标签的 accept 属性
HTML <input> 标签
定义和用法
accept 属性只能与 <input type="file"> 配合使用。它规定能够通过文件上传进行提交的文件类型。
提示：请避免使用该属性。应该在服务器端验证文件上传。

实例
在文件上传中使用 accept 属性，本例中的输入字段可以接受 GIF 和 JPEG 两种图像：
<form>
<input type="file" name="pic" id="pic" accept="image/gif, image/jpeg" />
</form>

如果不限制图像的格式，可以写为：accept="image/*"。
语法
<input accept="value">

属性值
值描述
MIME_type 用逗号隔开的 MIME 类型列表。

HTML <input> 标签

eugenepada 2009-06-16

打赏
举报



<body>

  <input type="file" onchange="test(this,'txt');">

</body>



<script>

  function test(obj,filter){



    var file = obj.value.match(/[^\/\\]+$/gi)[0];

    var rx = new RegExp('\\.(' + (filter?filter:'') + ')$','gi');

    if(filter&&file&&!file.match(rx)){

      alert("只能选择txt");

      //重新构建input file

      document.body.innerHTML = "<input type='file' onchange=\"test(this,'txt');\" >";

    }

  }

</script>

gahaya 2009-06-15

打赏
举报

我是这么做的 check_fileType会被下边两个方法调用所以写得有点多本来是可以在一个方法直接完事的
function check_fileType(fileObj)
{
if (fileObj.value != "") {
var type_count = 0;
var pos = fileObj.value.lastIndexOf(".");
var lastname = fileObj.value.substring(pos, fileObj.value.length);
for (var i = 0; i < typeArr.length; i++) {
if (lastname.toLowerCase() == typeArr[i])
{
type_count++;
}
}
return type_count == 0;
} else {
return false;
}
}

//file组件onchange调用用户选择了文件就执行此方法
function verify_file_type(fileObj) {
if (check_fileType(fileObj)) {
alert("请上传 " + typeArr.join(" 或 ") + "类型的附件!");
fileObj.focus();
}
}
//在用户点击"完成"按钮再调用一次
if (check_fileType(document.form1.orginalFile)) {
alert("请上传 .doc 或 .rar 类型的附件!");
document.form1.orginalFile.focus();
return false;
}

xiaoliangbusa1 2009-06-15

打赏
举报

在网上还没收到，还是有点不死心。暂时只能这么办了

xiaotupansy 2009-05-07

打赏
举报

<input type="file" id="file1" onchange="change(this)"/>

function change(o) {
//o.value就是你选择的文件的完整路径,然后你可以自己过滤
if (o.value.indexOf('.txt') > -1)
//code
else
//code
}