freeCodeCamp/guide/chinese/html/html-forms/index.md

2.7 KiB
Raw Blame History

title localeTitle
HTML Forms HTML表单

HTML表单

基本上,表单用于收集用户输入的数据,然后将其发送到服务器以进行进一步处理。它们可用于不同类型的用户输入,例如姓名,电子邮件等。

表单包含围绕<form></form>标签的控件元素,如input ,可以有类似的类型:

  • text
  • email
  • password
  • checkbox
  • radio
  • submit
  • range
  • search
  • date
  • time
  • week
  • color
  • datalist

代码示例:


<form> 
    <label for="username">Username:</label> 
    <input type="text" name="username" id="username"> 
    <label for="password">Password:</label> 
    <input type="password" name="password" id="password"> 
    <input type="radio" name="gender" value="male">Male<br> 
    <input type="radio" name="gender" value="female">Female<br> 
    <input type="radio" name="gender" value="other">Other 
    <input list="Options"> 
    <datalist id="Options"> 
      <option value="Option1"> 
      <option value="Option2"> 
      <option value="Option3"> 
    </datalist> 
    <input type="submit" value="Submit"> 
    <input type="color"> 
    <input type="checkbox" name="correct" value="correct">Correct 
 </form> 

形成的其他元素可以包含:

  • textarea - 是一个多行框,最常用于添加一些文本,例如。评论。 textarea的大小由行数和列数定义。
  • select - 与<option></option>标签一起创建下拉选择菜单。
  • button - 按钮元素可用于定义可单击按钮。

有关HTML FORMS的更多信息。

如果要从站点访问者收集一些数据则需要HTML表单。例如在用户注册期间您希望收集姓名电子邮件地址信用卡等信息。

表单将从站点访问者获取输入然后将其发布到后端应用程序如CGIASP脚本或PHP脚本等。后端应用程序将根据内部定义的业务逻辑对传递的数据执行所需的处理应用程序。

有各种表单元素可用如文本字段textarea字段下拉菜单单选按钮复选框等。

HTML <form>标记用于创建HTML表单它具有以下语法 -

html <form action = "Script URL" method = "GET|POST"> form elements like input, textarea etc. </form>

如果未定义表单方法则默认为“GET”。

表单标记还可以具有名为“target”的属性该属性指定链接将打开的位置。它可以在浏览器选项卡框架或当前窗口中打开。

action属性定义提交表单时要执行的操作。 通常当用户单击提交按钮时表单数据将发送到脚本URL的网页。如果省略action属性则操作将设置为当前页面。