H5文件操作(type="file")

H5文件操作(type="file")

游戏|数码彩彩2024-02-25 7:38:42508A+A-

file 对象的属性:

• name : 文件名,不包含路径。

• type : 文件类型。图片类型的文件都会以 image/ 开头,可以由此来限制只允许

上传图片。

• size : 文件大小。可以根据文件大小来进行其他操作。

• lastModified : 文件最后修改的时间。

代码:

H5文件操作(type="file")

 

输出结果 :

H5文件操作(type="file")

 

accept 属性

input 中有个 accept 属性,可以用来规定能够通过文件上传进行提交的文件

类型。accept="image/*" 可以用来限制只允许上传图像格式。但是在 Webkit 浏览器

下却出现了响应滞慢的问题,要等上好几秒才弹出文件选择框。 解决方法就是将 * 通配符改为指定的 MIME 类型。

H5文件操作(type="file")

 

代码直接复制就可以使用

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<meta http-equiv="X-UA-Compatible" content="ie=edge">

<title>Document</title>

</head>

<body>

<input type="file" id="files" accept="image/gif,image/jpeg,image/jpg,image/png">

<script>

var elem = document.getElementById('files');

elem.onchange = function () {

console.log(this.files)

}

</script>

</body>

</html>

点击这里复制本文地址 版权声明:本文内容由网友提供,该文观点仅代表作者本人。本站(https://www.angyang.net.cn)仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件举报,一经查实,本站将立刻删除。

昂扬百科 © All Rights Reserved.  渝ICP备2023000803号-3网赚杂谈