扣丁学堂HTML5培训简述HTML5新特性之type=file文件上传功能

ITxuexi_66 · · 1557 次点击 · 开始浏览    置顶
这是一个创建于 的主题,其中的信息可能已经有所发展或是发生改变。

本篇文章扣丁学堂HTML5培训小编给读者们介绍了HTML5新特性之type=file文件上传功能,对HTML5开发技术感兴趣的小伙伴就随小编来了解一下吧。 ​ 1、语法 <input name="myFile" type="file"> 2、属性(以下三个仅HTML5支持,因此存在兼容性问题) (1)multiple :表示用户是否可以选择多个值。multiple只能用于type=file和type=email。 (2)accept:服务器接受的文件类型,否则将被忽略。 音频/ *代表声音文件。仅HTML5支持 视频/ *代表视频文件。仅HTML5支持 图像/ *表示图像文件。仅HTML5支持 (3)required:此属性指定用户在提交表单之前必须填写一个值。 3、获取上传的文件信息 <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="ie=edge" /> <title>file multiple</title> </head> <body> <input type="file" multiple="multiple" id="test"> <p id='content'></p> <script type="text/javascript"> var test = document.getElementById('test'); test.addEventListener('change', function() { var t_files = this.files; var str = ''; for(var i = 0, len = t_files.length; i < len; i++) { console.log(t_files[i]); str += '<a href="javascript:void(0)">' + t_files[i].name + '</a><br/>'; }; document.getElementById('content').innerHTML = str; }, false); </script> </body> </html> 显示: 要了解更多内容的小伙伴可以登录扣丁学堂官网咨询。想要学好HTML5开发小编给大家推荐口碑良好的扣丁学堂,扣丁学堂有专业老师制定的HTML5学习路线图辅助学员学习,此外还有与时俱进的HTML5课程体系和HTML5视频教程供大家学习,想要学好HTML5开发技术的小伙伴快快行动吧。扣丁学堂H5技术交流群:673883249。

有疑问加站长微信联系(非本文作者)

入群交流(和以上内容无关):加入Go大咖交流群,或添加微信:liuxiaoyan-s 备注:入群;或加QQ群:692541889

1557 次点击  
加入收藏 微博
添加一条新回复 (您需要 登录 后才能回复 没有账号 ?)
  • 请尽量让自己的回复能够对别人有帮助
  • 支持 Markdown 格式, **粗体**、~~删除线~~、`单行代码`
  • 支持 @ 本站用户;支持表情(输入 : 提示),见 Emoji cheat sheet
  • 图片支持拖拽、截图粘贴等方式上传