html的表单空间,HTML的表单标签 - theyhq的个人空间 - OSCHINA - 中文开源技术交流社区...

表单：

概念：用于采集用户输入的数据的。用于和服务器进行交互。

form：用于定义表单的。可以定义一个范围，范围代表采集用户数据的范围

例如：

用户名:

密码:

其中从form开始到form结束的部分，就是用来获取用户数据的。

from的属性：

* action：指定提交数据的URL，'#'意为本地

* method:指定的提交方式，一共7种，2种比较常用，分别是get和post。

get及其特点：

1. 请求参数会在地址栏中显示。会封装到请求行中(HTTP协议后讲    解)。

2. 请求参数大小是有限制的。

3. 不太安全。

       如图，输入的信息在地址栏中显示了。

post及其特点：

表单项标签： * input：可以通过type属性值，改变元素展示的样式 * type属性： * text：文本输入框，默认值  1. 请求参数不会再地址栏中显示。会封装在请求体中(HTTP协议后讲    解)

2. 请求参数的大小没有限制。

3. 较为安全

如图，使用post登录后不再在地址栏中显示信息。

表单项中的数据要想被提交：必须指定其name属性，即代码中的username和password。

登录框

该语法提供一个登录框,用户名和密码框是上面语法提供的

表单项标签：通过控制input的type属性来控制

text：文本输入框，默认值

如刚才的输入用户名和密码的代码，它们未曾规定type属性，所以都默认是文本形式。

radio：点击选择框

该段代码提供了一个选择框，如性别男和女和不男不女

性别: 男

女

不男不女

需要注意的是，如果想控制只能选择这几个选项中的一个，那么它们的内幕属性就必须是相同的。

服务器通过这个value属性来得到用户选择的值。

效果图

checkbox:点击复选框

该段代码提供了一个复选框，可供多项选择。

逛街

Java

游戏

效果图

原理和单选框无什么差别。

特别地，两者都可再某个属性上再添加一个 checked 属性，这样会使得该选项会被默认选中。

提示信息(属性):placeholder属性

就是平时那种“请输入用户名的”的提示信息，用户一点就没了。

常用于文本框。

用户名:

效果图

提高点击体验(标签)：label标签(配合id属性食用)

label：指定输入项的文字描述信息。

注意：

label的for属性要和 input 的 id搭配着使用。属性值 对应。如果对应了，则点击label区域，会让input输入框获取焦点。

就好比上图中的输入用户名，你点击用户名这三个字，光标就会自动弹入输入框内。

诀窍：要在哪个字上添加该效果就在这个字的前后加上label标签就行了。

具体语法

性别:

隐藏域：hidden

该语法用来创建一个隐藏域

所谓隐藏域就是藏起来看不到的一个东西，但提交时会将该块区域的内容一并提交上去。

几个按钮

几个常用的按钮

第一条语句就是创建一个提交按钮，将页面内的表单交上去。

第二条语句是创建一个普通的按钮，功能要配合js实现。

第三条语句是创建一个带有提交功能的图片，点击即可提交。 该注意的是，此处按钮们的值都是value，而非name；

总结

value属性带的值似乎是真真切切提交到服务器上的值，而name属性则似乎是数据库表中的属性列名，如"性别"“姓名”"年龄"等。

根据以下图推断。