HTML的form表单标签详解~

通过HTML提交表单数据有web中是非常常用的操作,所以有必要详细、仔细学习了解HTML的form表单。

目录

  • [01-关键词 novalidate 是什么意思?](#01-关键词 novalidate 是什么意思?)
  • [02- action="" 是什么意思?](#02- action="" 是什么意思?)
  • [03- enctype="multipart/form-data" 是什么意思?](#03- enctype="multipart/form-data" 是什么意思?)

01-关键词 novalidate 是什么意思?

示例代码:

html 复制代码
 <form novalidate method="post" class="form-horizontal">

答:在HTML中,novalidate 是一个布尔属性,通常用于 <form> 元素中。它用来指示浏览器不应该对表单中的输入进行验证,即不执行浏览器默认的表单验证行为。

当表单中的 novalidate 属性被设置时,浏览器将不会执行对表单字段的验证,包括输入是否符合类型、是否满足必填条件等。这对于那些希望自定义验证逻辑或在后端进行验证的情况非常有用。你可以通过JavaScript来处理自定义的验证逻辑,并在需要时通过表单的提交事件来触发验证。

novalidate 属性被应用在 <form> 标签上,这意味着在提交表单时,浏览器不会执行默认的表单验证,而是需要通过其他方式来处理验证逻辑。这可能是因为开发人员想要使用自己的验证逻辑,或者他们计划在后端进行验证。

02- action="" 是什么意思?

示例代码:

html 复制代码
<form novalidate action="" method="post" class="form-horizontal">

action="":这是 <form> 元素的一个属性,用于指定在表单提交时要发送数据的目标URL。空字符串 "" 表示数据将被提交到当前页面。

03- enctype="multipart/form-data" 是什么意思?

示例代码:

html 复制代码
<form novalidate action="" method="post" enctype="multipart/form-data" class="form-horizontal">

在HTML中,enctype<form> 元素的一个属性,用于指定在提交表单数据时所使用的编码类型。multipart/form-data 是其中一种编码类型,通常用于在表单中上传文件或二进制数据。

当你在表单中有文件上传字段(例如 <input type="file">)或者需要发送二进制数据时,你需要将表单的 enctype 属性设置为 multipart/form-data,以便正确处理这些数据。这种编码方式允许将二进制文件数据以及其他表单字段的数据一起编码并发送到服务器。

multipart/form-data 编码将表单数据分成多个部分,每个部分都有自己的头部信息和内容。这种编码方式适用于文件上传,因为它能够正确处理文件的二进制数据,而其他的编码方式(例如默认的 application/x-www-form-urlencoded)可能会导致文件数据损坏或丢失。

所以,enctype="multipart/form-data" 表示表单将以多部分形式编码,适用于包含文件上传或二进制数据的情况。

相关推荐
草莓熊Lotso2 分钟前
C++ 方向 Web 自动化测试入门指南:从概念到 Selenium 实战
前端·c++·python·selenium
Olrookie14 分钟前
若依前后端分离版学习笔记(二十)——实现滑块验证码(vue3)
java·前端·笔记·后端·学习·vue·ruoyi
533_1 小时前
[vue] dayjs 显示实时时间
前端·javascript·vue.js
故事与他6451 小时前
XSS_and_Mysql_file靶场攻略
前端·学习方法·xss
莫的感情2 小时前
下载按钮点击一次却下载两个文件问题
前端
一个很帅的帅哥2 小时前
JavaScript事件循环
开发语言·前端·javascript
小宁爱Python2 小时前
Django Web 开发系列(二):视图进阶、快捷函数与请求响应处理
前端·django·sqlite
fox_2 小时前
深入理解React中的不可变性:原理、价值与实践
前端·react.js
Github项目推荐2 小时前
你的错误处理一团糟-是时候修复它了-🛠️
前端·后端
Code小翊2 小时前
C语言bsearch的使用
java·c语言·前端