文件上传是网站中一种常见的功能。例如百度网盘、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. 算法小白刷了一周 LeetCode 后的思考

    Hi,我是 itchao 我自己工作有 2 两年多的前端开发经验,但是数据结构与算法一直不好,基本就是一个算法小白的水平. 听说大公司面试都要手写算法题,最近为了以后能去更好的公司,然后其实心里比较着 ...

  2. Prometheus之自定义标签

    前言: 我们一般通过grafana导入Dashboard模板用来展示数据,但是有时候需要自己定义展示项目,这时需要自己在Prometheus重新自定义标签,并在grafana进行应用. 1.Prome ...

  3. 高并发场景QPS等专业指标揭秘大全与调优实战

    高并发场景QPS等专业指标揭秘大全与调优实战 最近经常有小伙伴问及高并发场景下QPS的一些问题,特意结合项目经验和网上技术贴做了一些整理和归纳,供大家参考交流. 一.一直再说高并发,多少QPS才算高并 ...

  4. Web 在线制表工具稳定吗?和桌面报表工具对比哪个好用?

    报表工具中最成熟常用的基本都是桌面设计器,但是 web 在线制表工具也占有部分市场,这是因为它也有一些优点: 1.报表设计和发布都在 web 端,无需额外安装桌面设计器 2.web 在线制表工具可直接 ...

  5. Python 生成带Logo的圆角带边框二维码

    Python 生成二维码方式就不累述了,不会的自己百度吧 但python生成的二维码太难看了,要么没有logo,要么logo直接贴进去的,难看死了,有的也处理了一下,但没有圆角,也难看: 以下:是不是 ...

  6. Kafka的实现细节

    Kafka的实现细节 一.Topic和Partition 在Kafka中的每一条消息都有一个topic.一般来说在我们应用中产生不同类型的数据,都可以设置不同的主题.一个主题一般会有多个消息的订阅者, ...

  7. xxx,一个神奇的 Python 库

    前几天,我在<技术周刊的转变:如何平衡热爱与现实?>一文里写过国内 Python 自媒体圈在近几年的两个现象(仅个人观感,无科学数据支撑): Python 广告投放出现断崖式萎缩 Pyth ...

  8. tensorflow如何切换CPU和GPU

    import os if Bert_Use_GPU: os.environ['CUDA_VISIBLE_DEVICES'] = '0,1' #使用GPU0,1 else: os.environ['CU ...

  9. 力扣512(MySQL)-游戏玩法分析Ⅱ(简单)

    题目: 需求:请编写一个 SQL 查询,描述每位玩家首次登陆的设备名称 查询结果格式在以下示例中: 解题思路: 方法一:使用dense_rank() over(partition by ...orde ...

  10. 力扣1768(java&python)-交替合并字符串(简单)

    题目: 给你两个字符串 word1 和 word2 .请你从 word1 开始,通过交替添加字母来合并字符串.如果一个字符串比另一个字符串长,就将多出来的字母追加到合并后字符串的末尾. 返回 合并后的 ...