过滤文件仅上传文本文件

时间:2012-08-20 06:45:07

标签: javascript html asp.net-mvc file-upload

我使用的是Firefox 14.0.1版。我需要过滤上传文件窗口以仅显示.txt个文件。

我的浏览器不仅支持文本文件(text/plain)。我可以通过指定此格式("image/*")来限制图像文件。但我需要在“文件选择器”窗口中仅过滤文本文件

我的浏览器有问题吗?

2 个答案:

答案 0 :(得分:3)

只需这样做 ...

$("#form").submit(function(e) {
  e.preventDefault();
  var checkUploadFileExtension =  $('input[type=file]').val().replace(/C:\\fakepath\\/i, '').split('.').pop();

  if(checkUploadFileExtension === 'txt') {
    alert("Success Uploaded!");
    //Do Something
  } else {
    alert("Please upload text file only");
    //Show error
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<form id="form" name="form" method="post">
  <input name="file" id="file" type="file" accept="text/*" />
  <button class="btn operations-btn btn-default" id="submit">Upload</button>
</form>

我希望,能帮到我的职位。谢谢

答案 1 :(得分:1)

所以根据MDN reference on the input element accept=[MIME Type]在Gecko中未实现,目前你只能这样做:accept=image|audio|video

您可以这样做的一种方法是在asp.net-mvc控制器上检查类型的服务器端。

但更好的方法是在客户端上使用一些javascript:这样的事情:

<script>
function checkExt() {
 if(document.mainForm.myfile.value.lastIndexOf(".txt")==-1) {
    alert("Please upload only .txt extention file");
    return false;
 }
}
</script>
<form name="mainForm">
<input type="file" name="myfile" onchange="checkExt();"/>
</form>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

看到它在这里运行: http://jsfiddle.net/Egr9V/

如果您使用JQuery,您可以使代码更加流畅或使用本文中所述的Validation插件: How to have jQuery restrict file types on upload?