HTML Input表单属性

form 属性

  • input 的 form 属性规定 <input> 元素所属的表单。
  • 此属性的值必须等于它所属的 <form> 元素的 id 属性。

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

<form action="/action_page.php" id="form1">
  <label for="fname">姓氏:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <input type="submit" value="提交">
</form>

<label for="lname">名字:</label>
<input type="text" id="lname" name="lname" form="form1">

formaction 属性

  • input 的 formaction 属性规定当提交表单时,对输入(数据)进行处理的文件的 URL。
  • 注释:该属性会覆盖 <form> 元素的 action 属性。
  • formaction 属性适用于以下输入类型:submit 和 image。

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

<form action="/action_page.php">
  <label for="fname">姓氏:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">名字:</label>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit" value="提交">
  <input type="submit" formaction="/action_page2.php" value="以管理员提交">
</form>

formenctype 属性

  • input 的 formenctype 属性指定提交时应如何编码表单数据(仅适用于 method=“post” 的表单)。
  • 注释:此属性将覆盖 <form> 元素的 enctype 属性。
  • formenctype 属性适用于以下输入类型:submit 和 image。

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

<form action="/action_page_binary.asp" method="post">
  <label for="fname">First name:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <input type="submit" value="提交">
  <input type="submit" formenctype="multipart/form-data"
  value="以 Multipart/form-data 编码提交">
</form>

formmethod 属性

  • input 的 formmethod 属性定义了将表单数据发送到 action URL 的 HTTP 方法。
  • 注释:此属性将覆盖 <form> 元素的 method 属性。
  • formmethod 属性适用于以下输入类型:submit 和 image。
  • 表单数据可以作为 URL 变量(method=“get”)或作为 HTTP post 事务(method=“post”)发送。

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

<form action="/action_page.php" method="get">
  <label for="fname">姓氏:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">名字:</label>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit" value="使用 GET 提交">
  <input type="submit" formmethod="post" value="使用 POST 提交">
</form>

formtarget 属性

  • input 的 formtarget 属性指定一个名称或关键字,该名称或关键字规定在提交表单后在何处显示收到的响应。
  • 注释:此属性将覆盖 <form> 元素的 target 属性。
  • formtarget 属性适用于以下输入类型:submit 和 image。

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

<form action="/action_page.php">
  <label for="fname">姓氏:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">名字:</label>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit" value="提交">
  <input type="submit" formtarget="_blank" value="提交到新窗口/标签页">
</form>

formnovalidate 属性

  • input 的 formnovalidate 属性规定提交时不应验证 <input> 元素
  • 注释:此属性将覆盖 <form> 元素的 novalidate 属性。
  • formnovalidate 属性适用于以下输入类型:submit。

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

<form action="/action_page.php">
  <label for="email">Enter your email:</label>
  <input type="email" id="email" name="email"><br><br>
  <input type="submit" value="提交">
  <input type="submit" formnovalidate="formnovalidate"
  value="不进行验证的提交">
</form>

novalidate 属性

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

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

<form action="/action_page.php" novalidate>
  <label for="email">Enter your email:</label>
  <input type="email" id="email" name="email"><br><br>
  <input type="submit" value="提交">
</form>

以上内容均整理自W3C,如需阅读全文请点击链接。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值