我想限制可以从本机操作系统文件选择器中选择的文件类型，当用户单击HTML中的<input type="file">元素中的Browse按钮时。我感觉这是不可能的，但我想知道是否有解决办法。我希望只使用HTML和JavaScript;请不要用闪光灯。
当前回答
是的，你说得对。这在HTML中是不可能的。用户将能够选择任何他/她想要的文件。
您可以编写一段JavaScript代码来避免根据扩展名提交文件。但请记住，这绝不能阻止恶意用户提交他/她真正想要的任何文件。
喜欢的东西:
function beforeSubmit()
{
var fname = document.getElementById("ifile").value;
// check if fname has the desired extension
if (fname hasDesiredExtension) {
return true;
} else {
return false;
}
}
HTML代码:
<form method="post" onsubmit="return beforeSubmit();">
<input type="file" id="ifile" name="ifile"/>
</form>
其他回答
你实际上可以用javascript来做，但记住js是客户端，所以你实际上是“警告用户”他们可以上传什么类型的文件，如果你想避免(限制或限制如你所说)某些类型的文件，你必须在服务器端做它。
如果您想开始服务器端验证，请查看这个基本的tut。对于整个教程，请访问这个页面。
好运！
您可以使用更改事件监视用户选择的内容，并在此时通知他们该文件不可接受。它没有限制实际显示的文件列表，但是除了不受支持的accept属性之外，它是最接近客户端的。
var file = document.getElementById('someId'); 文件。Onchange =函数(e) { Var ext = this.value.match(/\.([^\.]+)$/)[1]; Switch (ext) { 例“jpg”: 例“bmp”: 例“png”: 气管无名动脉瘘管的情况下“”: 警报(允许的); 打破; 默认值: 警报(“不允许”); 这一点。Value = "; ｝ }; <input type="file" id="someId" />
JSFiddle
从技术上讲，您可以在input元素上指定accept属性(html5中的另一种选择)，但它不受适当支持。
我知道有点晚了。
function Validatebodypanelbumper(theForm)
{
var regexp;
var extension = theForm.FileUpload.value.substr(theForm.FileUpload1.value.lastIndexOf('.'));
if ((extension.toLowerCase() != ".gif") &&
(extension.toLowerCase() != ".jpg") &&
(extension != ""))
{
alert("The \"FileUpload\" field contains an unapproved filename.");
theForm.FileUpload1.focus();
return false;
}
return true;
}
您可以在文件选择框中使用“accept”属性作为过滤器。 使用“accept”可以帮助您根据“后缀”或“MIME类型”过滤输入文件
1.基于后缀的过滤: 这里的“accept”属性只允许选择扩展名为。jpeg的文件。
<input type="file" accept=".jpeg" />
2.基于“文件类型”的过滤器 这里的“accept”属性只允许你选择一个“image/jpeg”类型的文件。
<input type="file" accept="image/jpeg" />
重要提示:我们可以更改或删除文件的扩展名，而不改变模因类型。例如，可以有一个没有扩展名的文件，但该文件的类型可以是“image/jpeg”。所以这个文件不能通过accept=".jpeg"过滤器。但是它可以传递accept="image/jpeg"。
3.我们可以使用*来选择各种文件类型。例如下面的代码允许选择所有类型的图像。例如"image/png"或"image/jpeg"或... .所有这些都是允许的。
<input type="file" accept="image/*" />
4.我们可以在select属性中使用cama(，)作为“或操作符”。例如，允许所有类型的图像或pdf文件，我们可以使用以下代码:
<input type="file" accept="image/* , application/pdf" />
