输入类型=文件 "Accept" 属性 在 Chrome 中不起作用?
Input type=File "Accept" property does not work in Chrome?
已经浏览了相当多的文档,但似乎没有在 Chrome 中使用这个非常基本的东西。
<input type="file" accept=".jpg, .png"/>
打开的对话框仅在扩展 drop-down 中显示 "Custom Files"。看到这个 Fiddle.
它似乎只适用于单个扩展规范。也尝试使用一些 mime 类型无济于事。
由于这个 post 有一个活跃的赏金,我不能将它标记为重复,但我强烈建议您阅读 this 其他 Whosebug post 相同的主题。我认为它为您的问题提供了正确的信息量。干杯!
我同意@Eugenio 的评论。您可以在 client-side 和 server-side.
验证它
如果您使用 accept="image/*"
而不是 Custom Files
,它将显示 Image Files
function validate() {
var fileName = document.getElementById("fileType").value;
var dot = fileName.lastIndexOf(".") + 1;
var extFile = fileName.substr(dot, fileName.length).toLowerCase();
if (extFile == "jpg" || extFile == "jpeg") {
//accepted
} else {
alert("Only jpg and jpeg image files allowed!");
}
}
<input type="file" id="fileType" accept="image/*" onchange="validate()"/>
已经浏览了相当多的文档,但似乎没有在 Chrome 中使用这个非常基本的东西。
<input type="file" accept=".jpg, .png"/>
打开的对话框仅在扩展 drop-down 中显示 "Custom Files"。看到这个 Fiddle.
它似乎只适用于单个扩展规范。也尝试使用一些 mime 类型无济于事。
由于这个 post 有一个活跃的赏金,我不能将它标记为重复,但我强烈建议您阅读 this 其他 Whosebug post 相同的主题。我认为它为您的问题提供了正确的信息量。干杯!
我同意@Eugenio 的评论。您可以在 client-side 和 server-side.
验证它如果您使用 accept="image/*"
而不是 Custom Files
,它将显示 Image Files
function validate() {
var fileName = document.getElementById("fileType").value;
var dot = fileName.lastIndexOf(".") + 1;
var extFile = fileName.substr(dot, fileName.length).toLowerCase();
if (extFile == "jpg" || extFile == "jpeg") {
//accepted
} else {
alert("Only jpg and jpeg image files allowed!");
}
}
<input type="file" id="fileType" accept="image/*" onchange="validate()"/>