文件上传是网站中一种常见的功能。例如百度网盘、QQ 邮箱以及有道云笔记都可以实现文件的上传。在 HTML 中,把 <input> 标签的 type 属性设置为 file 就可以实现上传文件的功能,又叫做文件上传域。

具体语法格式如下:

<input type="file" />

  

例子:

<form action="xxx" method="post" enctype="multipart/form-data">
<input type="file" name="file" accept="image/png"/><br/>
<input type="submit"/>
</form>

  

注意:上传文件时,需要把 method 属性设置为 post(get 方式不能提交文件)。

———— 属性:

1、<form> 标签的 enctype 属性

enctype 属性规定被提交数据的编码。如果提交数据中包含文件时,需要把 <form> 标签的 enctype 属性设置为 multipart/form-data。如果不这样设置,文件将无法正常提交。

2、<input> 标签的 accept 属性

当 <input> 标签的 type 属性为 file 时,使用 accept 属性可以规定上传文件的类型。如果 accept 的属性值为多个,它们之间需要用逗号隔开。

3、<input>标签的multiple 属性

表示可以同时选择多个文件一起上传。

———— 常用的文件类型:

HTML——文件上传域的更多相关文章

  1. 使用ajaxfileupload.js实现文件上传

    ajaxFileUpload是一个异步上传文件的jQuery插件 语法:$.ajaxFileUpload([options]) options参数说明: 1.url  上传处理程序地址. 2,file ...

  2. jsp\struts1.2\struts2 中文件上传(转)

    jsp\struts1.2\struts2 中文件上传 a.在jsp中简单利用Commons-fileupload组件实现 b.在struts1.2中实现c.在sturts2中实现现在把Code与大家 ...

  3. h5 input file ajax实现文件上传

    <input type="file" accept="image/*" height="0" class="file_inp ...

  4. SpringMVC文件上传 Excle文件 Poi解析 验证 去重 并批量导入 MYSQL数据库

    SpringMVC文件上传 Excle文件 Poi解析并批量导入 MYSQL数据库  /** * 业务需求说明: * 1 批量导入成员 并且 自主创建账号 * 2 校验数据格式 且 重复导入提示 已被 ...

  5. Spring MVC使用commons fileupload实现文件上传功能

    通过Maven建立Spring MVC项目,引入了Spring相关jar依赖. 1.为了使用commons fileupload组件,需要在pom.xml中添加依赖: <properties&g ...

  6. java 简单的文件上传

    一.文件上传原理: 1.文件上传的前提: a.form表单的method必须是post b.form表单的enctype必须是multipart/form-data(决定了POST请求方式,请求正文的 ...

  7. Query插件之ajaxFileUpload使用方法——input.change()事件的时候实现文件上传

    点击下载 这是HTML <input id="uploadedfile" name="uploadedfile" type="file" ...

  8. SpringBoot文件上传(MVC情况和webFlux情况)

    MVC情况 引入依赖 <?xml version="1.0" encoding="UTF-8"?> <project xmlns=" ...

  9. Jersey实现文件上传下载

    一 文件上传 使用ajaxFileUpload进行文件上传的前端处理.在ajaxFileupload.js中,针对服务端返回的类型增加text判断, //ajax文件上传 function ajaxF ...

  10. jQuery插件之ajaxFileUpload(ajax文件上传)

    一.ajaxFileUpload是一个异步上传文件的jQuery插件. 传一个不知道什么版本的上来,以后不用到处找了. 语法:$.ajaxFileUpload([options]) options参数 ...

随机推荐

  1. mmcls 多标签模型部署在torch serve

    GitHub仓库:gy-7/mmcls_multi_label_torchserve (github.com) 各个文件说明: cls_requests_demo:分类模型请求api服务的demo d ...

  2. 升级Django项目过程中问题记录

    升级内容: python版本:3.8.4升到3.10.7 Django版本:2.2.13升到4.2 所遇问题: 1. error in anyjson setup command: use_2to3 ...

  3. C++ 递归与面向对象编程基础

    C++ 递归 递归是一种使函数调用自身的技术.这种技术提供了一种将复杂问题分解为简单问题的方法,从而更容易解决问题. 递归可能有点难以理解.理解其工作原理的最佳方法是通过实验来尝试. 递归示例 将两个 ...

  4. Serverless 时代下微服务应用全托管解决方案

    简介: 本文介绍了 Serverless 时代下微服务的发展以及过程中遇到的相对较复杂的需求,面对这些,阿里云 Serverless 应用引擎 SAE 将"Serverless"的 ...

  5. 做ToB软件质量保障的这两年

    ​简介:自己算是阿里的老兵了,从实习开始一直投身在 toB 业务的质量保障领域内,不能说是资深的专家,但所经历的.感受的业务特点和体会还是具有一定的代表性,希望能通过这篇文章,总结一下过往,并能和已经 ...

  6. 快速界定故障:Socket Tracer网络监控实践

    ​ 简介: Socket Tracer定位是传输层(Socket&TCP)的指标采集工具,通过补齐网络监控的这部分盲区,来达到快速界定网络问题的目标. ​ 作者 | 四忌 来源 | 阿里技术公 ...

  7. [Go] 获得一个整数范围区间的随机数 (golang)

    示例:0,1 随机 package main import "fmt" import "math/rand" import "time" f ...

  8. [Ethereum] 浅谈 ERC20 在 openzeppelin-contracts 中的结构与实现

    目前 openzeppelin-contracts 的稳定版是 v2.5,截止到本文发布,最新的 Tag 为 v3.0.0-rc.0 以下是 token/ETC20 的文件列表: IERC20.sol ...

  9. Total Commander 使用 mklink 建立文件夹链接 将 C 盘文件迁移到其他盘

    在安装完成了 100000000 个软件之后,我 1T 的 C 盘的空间终于不足了,由于安装了大量的特别挑的不专业的软件,强行放在其他的盘将水土不服.于是在老师傅的指导下,我采用了 mklink 神奇 ...

  10. Intel Pentium III CPU(Coppermine, Tualatin) L2 Cache Latency, Hardware Prefetch特性调查

    这几天,偶然的机会想到了困扰自己和其他网友多年的Intel Pentium III系列处理器缓存延迟(L2 Cache Latency),以及图拉丁核心版本是否支持硬件预取(Hardware Pref ...