Form 表单

1、form表单有什么作用?有哪些常用的input 标签,分别有什么作用?

<form> 标签用于为用户输入创建 HTML 表单、向服务器传输数据。

<!--`<input type="button">`: 定义可点击的按钮,但没有任何行为,不会提交表单中的数据。button 类型常用于在用户点击按钮时启动 JavaScript 程序。,不会提交!!!-->
<input type="button" value="Click me" onclick="msg()" />

<!--`<input type="text" /> 定义用户可输入文本的单行输入字段。-->
Email: <input type="text" name="email" />
Pin: <input type="text" name="pin" />

<!--`<input type="submit" >`:定义提交按钮。提交按钮用于向服务器发送表单数据。数据会发送到表单的 action 属性中指定的页面。-->
<form action="form_action.asp" method="get">
Email: <input type="text" name="email" />
<input type="submit" />
</form>

<!--`<input type="reset">`:定义重置按钮。重置按钮会清除表单中的所有数据。-->
<input type="reset" />

<!--`<input type="checkbox">`:定义复选框-->
<input type="checkbox" name="vehicle" value="Bike" /> I have a bike
<input type="checkbox" name="vehicle" value="Car" /> I have a car

<!--`<input type="radio">`:定义单选按钮。-->
<input type="radio" name="sex" value="male" /> Male
<input type="radio" name="sex" value="female" /> Female

<!--`<input type="password" />`: 定义密码字段。密码字段中的字符会被掩码(显示为星号或原点)。-->
<input type="password" name="pwd" />

2、post 和 get 方式的区别?

1.get:在向后台传输数据时,会用&把数据连接起来,然后链接在?后面,形成一个新的URL。而post不会形成新的URL,但数据依旧能传输给后台。 2.get常用于向后台提取或查询数据,即输入一个提示词,后台根据提示词筛选数据,从而得到数据。而post常用于向后台传输数据,post的安全性较高。 3.get方式可提交的数据量跟URL的长度有直接关系,因此并不能传输大量的数据。而post传输的数据量取决于服务器的处理程序的处理能力,但相比get方式,能够传输较大量的数据。 4.在form中,Method的默认方式是get。

POST 还是 GET?

  • 如果希望获得最佳表单传输性能,可以采用 GET 方法发送只有少数简短字段的小表单。
  • 一些服务器操作系统在处理可以立即传递给应用程序的命令行参数时,会限制其数目和长度,在这种情况下,对那些有许多字段或是很长的文本域的表单来说,就应该采用 POST 方法来发送。
  • 如果你在编写服务器端的表单处理应用程序方面经验不足,应该选择 GET 方法。如果采用 POST 方法,就要在读取和解码方法做些额外的工作,也许这并不很难,但是也许你不太愿意去处理这些问题。
  • 如果安全性是个问题,那么我们建议选用 POST 方法。GET 方法将表单参数直接放在应用程序的 URL 中,这样网络窥探者可以很轻松地捕获它们,还可以从服务器的日志文件中进行摘录。如果参数中包含了信用卡帐号这样的敏感信息,就会在不知不觉中危及用户的安全。而 POST 应用程序就没有安全方面的漏洞,在将参数作为单独的事务传输给服务器进行处理时,至少还可以采用加密的方法。
  • 如果想在表单之外调用服务器端的应用程序,而且包括向其传递参数的过程,就要采用 GET 方法,因为该方法允许把表单这样的参数包括进来作为 URL 的一部分。而另一方面,使用 POST 样式的应用程序却希望在 URL 后还能有一个来自浏览器额外的传输过程,其中传输的内容不能作为传统 <a>标签的内容

3、在input里,name 有什么作用?

规定 input 元素的名称,用于对提交到服务器后的表单数据进行标识,或者在客户端通过 JavaScript 引用表单数据。

4.radio 如何 分组?

将需要设为同一分组的radio的name属性,设为相同值。 下面为同一组:

<input type="radio" name="number" value="1">1

<input type="radio" name="number" value="2">2

<input type="radio" name="number" value="3">3

下面为不同组:

<input type="radio" name="a" value="1">1

<input type="radio" name="b" value="1">1

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • HTML表单的用法

    小胖
  • HTML5

    小胖
  • React—表单及事件处理

    小胖
  • HTML

    超文本标记语言(英语:HyperText Markup Language,简称:HTML)是一种用于创建网页的标准标记语言。 您可以使用 HTML 来建立自己的...

    用户1173509
  • HTML标记之Form表单

    从访问的Web站点的用户那里获得信息。访问者可以使用诸如文本域、列表框、复选框以及单选按钮之类的表单元素输入信息,然后单击某个按钮提交这些信息。是客户端与服务...

    阿豪聊干货
  • html+css学习笔记011-表单

    Mr. 柳上原
  • JAVAWEB复习day01

    注意<input type="radio" name="sex" nav="nv"/>女

    阮键
  • python中input()与raw_input()的区别到底是啥?

    首先先给出总结:input () = int(raw_input()) 有图有真相!!! ? 先看看input的例子: ? 可见用input键入得到int类型的...

    marsggbo
  • 用户浏览器操作行为的一种记录方法

    记录用户浏览器操作行为是功能自动化测试工具用于录制测试脚本的先决条件,本文将介绍如何采取一种通用的方式,实现对于浏览器端透明地记录用户操作行为,从而实现用户行为...

    Criss@陈磊
  • HTML5新增的from表单input属性

    required:1->输入框不能为空; 2->浏览器需要对当前输入框做验证; autofocus:输入框自动聚焦; placeholder:占位符,提示用户输...

    德顺

扫码关注云+社区

领取腾讯云代金券