HTML Input form* 属性

收藏983

阅读893

更新时间2025-07-15

前言:

本章介绍 HTML <input> 元素的不同 form* 属性。

本章介绍 HTML 元素的不同 form* 属性。

form 属性

input 的 form 属性规定 元素所属的表单。

此属性的值必须等于它所属的

元素的 id 属性。

实例

位于 HTML 表单(但仍是表单的一部分)之外的输入字段:


  
  

运行实例 »

formaction 属性

input 的 formaction 属性规定当提交表单时,对输入(数据)进行处理的文件的 URL。

注释:该属性会覆盖

元素的 action 属性。

formaction 属性适用于以下输入类型:submit 和 image。

实例

带有两个提交按钮的 HTML 表单,它们具有不同的操作(action):


  
  



运行实例 »

formenctype 属性

input 的 formenctype 属性指定提交时应如何编码表单数据(仅适用于 method="post" 的表单)。

注释:此属性将覆盖

元素的 enctype 属性。

formenctype 属性适用于以下输入类型:submit 和 image。

实例

有两个提交按钮的表单。第一个发送使用默认编码的表单数据,第二个发送编码为 "multipart/form-data" 的表单数据:


  
  

运行实例 »

formmethod 属性

input 的 formmethod 属性定义了将表单数据发送到 action URL 的 HTTP 方法。

注释:此属性将覆盖

元素的 method 属性。

formmethod 属性适用于以下输入类型:submit 和 image。

表单数据可以作为 URL 变量(method="get")或作为 HTTP post 事务(method="post")发送。

关于 GET 的注意事项:

  • 以名称/值对的形式将表单数据追加到 URL
  • 永远不要使用 GET 发送敏感数据!(提交的表单数据在 URL 中可见!)
  • URL 的长度受到限制(2048 个字符)
  • 对于用户希望将结果添加为书签的表单提交很有用
  • GET 适用于非安全数据,例如 Google 中的查询字符串

关于 POST 的注意事项:

  • 将表单数据附加在 HTTP 请求的正文中(不在 URL 中显示提交的表单数据)
  • POST 没有大小限制,可用于发送大量数据。
  • 带有 POST 的表单提交无法添加书签

提示:如果表单数据包含敏感信息或个人信息,请务必使用 POST!

实例

有两个提交按钮的表单。第一个使用 method="get" 发送表单数据。第二个使用 method="post" 发送表单数据:


  
  



运行实例 »

formtarget 属性

input 的 formtarget 属性指定一个名称或关键字,该名称或关键字规定在提交表单后在何处显示收到的响应。

注释:此属性将覆盖

元素的 target 属性。

formtarget 属性适用于以下输入类型:submit 和 image。

实例

有两个提交按钮且有不同目标窗口的表单:


  
  



运行实例 »

formnovalidate 属性

input 的 formnovalidate 属性规定提交时不应验证 元素。

注释:此属性将覆盖

元素的 novalidate 属性。

formnovalidate 属性适用于以下输入类型:submit。

实例

有两个提交按钮的表单(进行和不进行验证):


  
  

运行实例 »

novalidate 属性

novalidate 属性是

属性。

如果已设置,novalidate 属性规定在提交时不应验证所有表单数据。

实例

规定在提交时不验证任何表单数据:


  
  

运行实例 »

HTML Form 和 Input 元素

标签 描述
为用户输入定义 HTML 表单。
定义输入控件。

如需所有可用 HTML 标签的完整列表,请访问我们的 HTML 标签参考手册。

相关

视频

RELATED VIDEOS

更多

免费

Web前端开发极速入门
初级 Web前端开发极速入门

219920次学习

收藏

免费

前端入门_HTML5
初级 前端入门_HTML5

616946次学习

收藏

免费

30分钟学会网站布局
初级 30分钟学会网站布局

238440次学习

收藏

免费

CSS视频教程-玉女心经版
初级 CSS视频教程-玉女心经版

393054次学习

收藏

免费

独孤九贱(1)_HTML5视频教程

免费

独孤九贱(6)_jQuery视频教程

免费

独孤九贱(7)_Bootstrap视频教程

免费

独孤九贱(2)_CSS视频教程
初级 独孤九贱(2)_CSS视频教程

229605次学习

收藏

科技资讯

更多

精选课程

更多
前端入门_HTML5
前端入门_HTML5

共29课时

61.7万人学习

CSS视频教程-玉女心经版
CSS视频教程-玉女心经版

共25课时

39.3万人学习

JavaScript极速入门_玉女心经系列
JavaScript极速入门_玉女心经系列

共43课时

70.9万人学习

独孤九贱(1)_HTML5视频教程
独孤九贱(1)_HTML5视频教程

共25课时

61.6万人学习

独孤九贱(2)_CSS视频教程
独孤九贱(2)_CSS视频教程

共22课时

23万人学习

独孤九贱(3)_JavaScript视频教程
独孤九贱(3)_JavaScript视频教程

共28课时

33.9万人学习

独孤九贱(4)_PHP视频教程
独孤九贱(4)_PHP视频教程

共89课时

125万人学习

关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号