2021-06-02

这里写目录标题

HTML表单

表单元素

1.<input> 元素
最重要的表单元素是 <input> 元素
<input> 元素根据不同的 type 属性,可以变化为多种形态。
type属性包括:text(文本输入),password(密码),submit( 定义提交表单数据至表单处理程序的按钮),radio(定义单选按钮),checkbox(定义复选框),button(定义按钮),number(数字),date(日期)
2.<select> 元素(下拉列表)
<select> 元素定义下拉列表:
实例
<select name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
</select>
<option> 元素定义待选择的选项。

列表通常会把首个选项显示为被选选项。

您能够通过添加 selected 属性来定义预定义选项。

  3.<textarea> 元素
   <textarea> 元素定义多行输入字段(文本域):
  4.<button> 元素
     <button> 元素定义可点击的按钮:

实例

   <button type="button" onclick="alert('Hello World!')">Click Me!</button>
   5.HTML5 <datalist> 元素
 <datalist> 元素为 <input> 元素规定预定义选项列表。

用户会在他们输入数据时看到预定义选项的下拉列表。

 <input> 元素的 list 属性必须引用 <datalist> 元素的 id 属性。

实例

  通过 <datalist> 设置预定义值的 <input> 元素:
     <form action="action_page.php">
    <input list="browsers">
    <datalist id="browsers">
    <option value="Internet Explorer">
    <option value="Firefox">
    <option value="Chrome">
    <option value="Opera">
    <option value="Safari">
    </datalist> 
    </form>

表单属性

定义:HTML 表单用于搜集不同类型的用户输入。 元素定义 HTML 表单:

元素的属性:

1.Action 属性
action 属性定义提交表单时要执行的操作。

通常,当用户单击“提交”按钮时,表单数据将发送到服务器上的文件中。

在下面的例子中,表单数据被发送到名为 “action_page.php” 的文件。该文件包含处理表单数据的服务器端脚本:
实例
提交后,将表单数据发送到 “action_page.php”:

<form action="/action_page.php">
  <label for="fname">First name:</label>
  </form>

如果省略 action 属性,则将 action 设置为当前页面。
2.Target 属性
target 属性规定提交表单后在何处显示响应。

target 属性可设置以下值之一:

描述
_blank响应显示在新窗口或选项卡中。
_self响应显示在当前窗口中。
_parent响应显示在父框架中。
_top响应显示在窗口的整个 body 中。
framename响应显示在命名的 iframe 中。

默认值为 _self,这意味着响应将在当前窗口中打开。

3.Method 属性
method 属性指定提交表单数据时要使用的 HTTP 方法。
对于http方法的使用详见https://www.w3school.com.cn/tags/html_ref_httpmethods.asp

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

提交表单数据时,默认的 HTTP 方法是 GET。

实例
在提交表单数据时使用 GET 方法:

 <form action="/action_page.php" method="get">

关于 GET 的注意事项:
以名称/值对的形式将表单数据追加到 URL
永远不要使用 GET 发送敏感数据!(提交的表单数据在 URL 中可见!)
URL 的长度受到限制(2048 个字符)
对于用户希望将结果添加为书签的表单提交很有用
GET 适用于非安全数据,例如 Google 中的查询字符串
关于 POST 的注意事项:
将表单数据附加在 HTTP 请求的正文中(不在 URL 中显示提交的表单数据)
POST 没有大小限制,可用于发送大量数据。
带有 POST 的表单提交无法添加书签
提示:如果表单数据包含敏感信息或个人信息,请务必使用 POST!

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值