html5 使用表单标签，与用户交互（重要章节） 可以百度百科 表单

网站怎样与用户进行交互？答案是使用HTML表单(form)。表单是可以把浏览者输入的数据传送到服务器端，这样服务器端程序就可以处理表单传过来的数据。

<form   method="传送方式"   action="服务器文件">
2.action ：浏览者输入的数据被传送到的地方,比如一个PHP页面(save.php)。
3.method ： 数据传送的方式（get/post）。

1、所有表单控件（文本框、文本域、按钮、单选框、复选框等）都必须放在<form></form>标签之间（否则用户输入的信息可提交不到服务器上哦！）。

2、method:post/get的区别这一部分内容属于后端程序员考虑的问题。

表单在网页中主要负责数据采集功能。一个表单有三个基本组成部分：（百度百科）

  1. 表单标签：这里面包含了处理表单数据所用CGI程序的URL以及数据提交到服务器的方法。 
  2.  表单域：包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框和文件上传框等。
  3. 表单按钮：包括提交按钮、复位按钮和一般按钮；用于将数据传送到服务器上的CGI脚本或者取消输入，还可以用表单按钮来控制其他定义了处理脚本的处理工作。

表单标签

<form></form>
功能：用于申明表单，定义采集数据的范围，也就是<form>和</form>里面包含的数据将被提交到服务器或者电子邮件里。
语法：<FORM ACTION="URL" METHOD="GET|POST" ENCTYPE="MIME" TARGET="...">. . .</FORM>
属性解释见下表：
action=url用来指定处理提交表单的格式.它可以是一个URL地址(提交给程式？)或一个电子邮件地址.
method=get或post指明提交表单的HTTP方法.
可能的值为： post；get：不赞成。
POST方法在表单的主干 包含名称/值对并且无需包含于action特性的URL中.
GET方法把名称/值对加在action的URL后面并且把新的URL送至服务器.这是往前兼容的缺省值.这个值由于国际化的原因不赞成使用.（缺省值）就是默认值。是指一个属性、参数在被修改前的初始值）
enctype=cdata指明用来把表单提交给服务器时(当method值为"post")的互联网媒体形式.这个特性的缺省值是"application/x-www-form-urlencoded"
TARGET="..."指定提交的结果文档显示的位置：
_blank ：在一个新的、无名浏览器窗口调入指定的文档；
_self ：在指向这个目标的元素的相同的框架中调入文档；
_parent ：把文档调入当前框的直接的父FRAMESET框中；这个值在当前框没有父框时等价于_self；
_top ：把文档调入原来的最顶部的浏览器窗口中(因此取消所有其它框架)；这个值等价于当前框没有你框时的_self.
例如：
表示表单将向以post的方式提交，提交的结果在新的页面显示，数据提交的媒体方式是默认的application/x-www-form-urlencoded方式；
表单域
表单域包含了文本框、多行文本框、密码框、隐藏域、复选框、单选框和下拉选择框等，用于采集用户的输入或选择的数据，下面分别讲述这些表单域的代码格式：

什么是表单域

就是一个<form></form>标签中间的部分哦

当点击这个表单域中的submit按钮就会把表单中的数据提交到你action的属性指定的网页里面

1.文本框

文本框是一种让访问者自己输入内容的表单对象，通常被用来填写单个字或者简短的回答，如姓名、地址等。
代码格式：<input type="text" name="..." size="..." maxlength="..." value="...">
属性解释：
type="text"定义单行文本输入框；
name属性定义文本框的名称，要保证数据的准确采集，必须定义一个独一无二的名称；（作用是什么?name属性给服务器辨别？)
size属性定义文本框的宽度，单位是单个字符宽度；
maxlength属性定义最多输入的字符数。
value属性定义文本框的初始值
样例1：
样例1代码：
<input type="text" name="example1" size="20" maxlength="15" />
 

文本输入框、密码输入框

当用户要在表单中键入字母、数字等内容时，就会用到文本输入框。文本框也可以转化为密码输入框。

<form>
   <input type="text/password" name="名称" value="文本" />
</form>

1、type：

   当type="text"时，输入框为文本输入框;

   当type="password"时, 输入框为密码输入框。

2、name：为文本框命名，以备后台程序ASP 、PHP使用。

3、value：为文本输入框设置默认值。(一般起到提示作用？)

<form  method="post" action="save.php">
    账户: 
    <input type="text" name="myName" value="文本" >
    <br>
    密码: 
    <input type="password" name="pass">
</form>

注意action="save.php”.(?)

当用户需要在表单中输入大段文字时，需要用到文本输入域。

语法：

<textarea  rows="行数" cols="列数">提示信息</textarea>

2.表单按钮

在表单中有两种按钮可以使用，分别为：提交按钮、重置。这一小节讲解提交按钮：当用户需要提交表单信息到服务器时，一定需要用到提交按钮。

语法：

<input   type="submit"   value="提交">

type：只有当type值设置为submit时，按钮才有提交作用

value：按钮上显示的文字

当用户需要重置表单信息到初始时的状态时，比如用户输入“用户名”后，发现书写有误，可以使用重置按钮使输入框恢复到初始状态。只需要把type设置为"reset"就可以。

语法：

<input type="reset" value="重置">

type：只有当type值设置为reset时，按钮才有重置作用

value：按钮上显示的文字

表单按钮控制表单的运作。
1.3.1 提交按钮
提交按钮用来将输入的信息(?)提交到服务器。
代码格式：<input type="submit" name="..." value="...">
属性解释：
type="submit"定义提交按钮；
name属性定义提交按钮的名称； （后台接收？）
value属性定义按钮的显示文字，起提示作用；
样例9：
样例9代码：
<input type="submit" name="mySent" value="发送">
 

posted on 2016-06-21 01:46  雪的心  阅读(283)  评论(0)  编辑  收藏  举报

导航