前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >提交文件至服务器的设置——表单属性中的 enctype

提交文件至服务器的设置——表单属性中的 enctype

作者头像
白鹿第一帅
修改2021-03-03 14:38:18
1.2K0
修改2021-03-03 14:38:18
举报

文章目录

  • 前言
  • 一、enctype 属性设置
  • 二、文件域的设置
  • 总结

前言

我们在使用 HTML 写表单的时候,如果需要上传本地文件至服务器,我们就需要对文件域中的 enctype 属性进行调整并设置提交方式,本文对这一属性做了简单总结和案例介绍。

在这里插入图片描述
在这里插入图片描述

一、enctype 属性设置

enctype 属性用于设置 MIME 类型,默认值为:

代码语言:javascript
复制
application/x-www-form-urlencoded

将文件上传至服务器,需将编码方式设置为下,同时表单提交方式应为 post。

代码语言:javascript
复制
multipart/form-data

二、文件域的设置

设置文件域时,type 的属性值必须为"file",name 设置文件域的名称,用于在脚本中获取域的数据。

代码如下:

代码语言:javascript
复制
<form name="form1" action="register.jsp" method="post" onsubmit="" enctype="multipart/form-data">
	请上传相片:<input type="file" name="photo">
</form>

运行截图如下:

在这里插入图片描述
在这里插入图片描述

说明:在上图中,用户可直接将需上传的文件路径填写在文本框中,也可以点击“浏览”按钮,在本地找到需要上传的文件。


总结

HTML 里面的小设置和细节特别多,需要特别细心还需要多做,这也就是为什么前端程序员里面女生比较多。当然,我们如果记不住可以去查 W3school 的教程,对于前端程序员来说是一本不错的字典。

在这里插入图片描述
在这里插入图片描述

我是白鹿,一个不懈奋斗的程序猿。望本文能对你有所裨益,欢迎大家的一键三连!若有其他问题、建议或者补充可以留言在文章下方,感谢大家的支持!

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2019-09-03 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 文章目录
  • 前言
  • 一、enctype 属性设置
  • 二、文件域的设置
  • 总结
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档