首页 > 其他分享 >HTML——form标签

HTML——form标签

时间:2022-08-31 20:24:45浏览次数:70  
标签:name form 标签 表单 HTML 提交 属性

Form标签:

  • HTML 表单用于收集用户输入,form定义 HTML 表单。
  •  表单能够包含 input 元素,比如文本字段、复选框、单选框、提交按钮等等。

子标签:

  • imput标签,用于对复选框、单选按钮、提交按钮等等。

属性字段:

  • name属性:如果要正确地被提交,每个输入字段必须设置一个 name 属性。
  • action属性:提交表单时执行的动作。如不定义,则设置为当前页面因为页面地址栏中是可见。
<form action="action_page.php">
  • Method属性:提交表单时所用的 HTTP 方法(GET 或 POST)

  1. get:默认方法,如果表单提交是被动的(比如搜索引擎查询),并且没有敏感信息。最适合少量数据的提交。
  2. post:POST 的安全性更好,因为在页面地址栏中被提交的数据是不可见的。
<form action="action_page.php" method="GET">
或:
<form action="action_page.php" method="POST">
  • input内的属性,text(文本可见),password(密码不可见),radio(单选框),submit(提交按钮)value(返回给服务端的key)
<!DOCTYPE html>
<html>
<body>

<form>
  First name:<br>
  <input type="text" name="firstname">
  <input type="password" name="password">
  <p>请注意表单本身是不可见的。</p>
  <p>同时请注意文本字段的默认宽度是 20 个字符。</p>
  <input type="radio" name="sex" value="male" checked>Male
  <input type="radio" name="sex" value="female">Female
  <p>请注意如果需要只选其一,那么name一样即可。</p>
  <input type="submit" value="Submit">
</form> 
</body>
</html>

  • fieldset默认显示输入框内信息

<form action="action_page.php">
  <fieldset>
  <legend>Personal information:</legend>
  First name:<br>
  <input type="text" name="firstname" value="Mickey">    ###这里value默认显示内容
</form> 

  • target属性:提交表单后在何处显示响应,默认为当前窗口打开
<form action="/action_page.php" target="_blank">
_blank	     响应显示在新窗口或选项卡中。
_self	        响应显示在当前窗口中。
_parent	     响应显示在父框架中。
_top	        响应显示在窗口的整个 body 中。
framename	响应显示在命名的 iframe 中。            

其他属性:

HTML5中新的属性:

属性描述
accept MIME_type HTML 5 中不支持。
accept-charset charset_list 规定服务器可处理的表单数据字符集。
action URL 规定当提交表单时向何处发送表单数据。
autocomplete
  • on
  • off
规定是否启用表单的自动完成功能。
enctype 见说明

规定在发送表单数据之前如何对其进行编码。

  • application/x-www-form-urlencoded
  • multipart/form-data
  • text/plain
method
  • get
  • post
规定用于发送 form-data 的 HTTP 方法。
name form_name 规定表单的名称。
novalidate novalidate 如果使用该属性,则提交表单时不进行验证。
rel
  • external
  • help
  • license
  • next
  • nofollow
  • noopener
  • noreferrer
  • opener
  • prev
  • search
规定链接资源和当前文档之间的关系。
target
  • _blank
  • _self
  • _parent
  • _top
  • framename
规定在何处打开 action URL。

标签:name,form,标签,表单,HTML,提交,属性
From: https://www.cnblogs.com/xinbing/p/16644407.html

相关文章

  • HTML——img标签
    img标签:图像标签单闭合标签基本格式:<body><imgsrc="这里放链接"alt="当加载失败时,显示这里信息"width="设置宽度(宽和高建议就设置一个,会等比例缩放)"height......
  • HTML——表格标签
    表格标签:1.双闭合标签字标签:使用tr字标签添加行。使用tr的字标签td添加字段使用th标签来添加表头,有加黑加粗效果。属性字段:border="1"表示添加边框cellspacin......
  • HTML——列表标签
    ol:orderedlist有序列表标签:1.默认数字列表子标签:li标签属性字段:a:abcdA,大字母i:iiiiiiI:IIIIIIstart属性设置起始,<body><ol><li>......
  • HTML——A标签
    a标签:anchor 锚点标签双闭合标签不单独占一行输入超链接,点击后跳转链接地址。#top:点击后返回本页面顶部可以和id属性配合,将ID和#字段进行重合,那么点击就会到id属......
  • HTML——stript标签
    script标签双闭合标签用于定义客户端脚本(JavaScript)常见用途是图像处理、表单验证和内容的动态更改。<script>document.getElementById("demo").innerHTML="Hell......
  • HTML——link标签
    link标签单闭合标签连接CSS文件外接CSS样式:rel:href:所连接的CSS样式表<head><metacharset="UTF-8"><linkrel="stylesheet"href="css/index"></head......
  • HTML——title标签
    title标签双闭合标签网站标题标签<title>新兵</title> ......
  • 前端——HTML常用标签合集
    HTML常用标签合集●HTML——head标签●HTML——meta标签●HTML——title标签●HTML——time&datetime(时间模块)......
  • HTML入门2(学习Head First HTML与CSS 第2版)
    <a>元素的内容会成为Web页面中可单击的文本。href属性告诉浏览器链接的目标文件。<ahref="链接地址">链接名称</a>1.一个页面链接到另一个页面,要使用<a>标签。2.<a>元......
  • HTML——meta标签
    meta标签特点:单闭合标签网站原信息,用户不可见可加属性:charset设置网页字符编码<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8">......