Download presentation
Presentation is loading. Please wait.
1
表单页面 表单是用户利用浏览器对Web站点网络数据库进行查询的一种界面，用户利用表单可以输入信息或选择选项等，然后将这些信息提交给服务器进行处理。通过表单，既可以将浏览器的信息发送到Internet服务器上，同时表单也可以使用户与站点的浏览者交互或从浏览者那里收集信息。它是网页的设计者和使用者相互交流的工具。表单对象包括文本域（单行、多行、密码）、列表、菜单、复选框、单选框、按钮等。 表单的操作是指用户与服务器交互的操作，服务器方面的操作是通过服务器的程序来实现的。
2
表单页面 1、表单域标签<form> action属性：输入的表单信息提交服务器的地址。取值为：url。
methed属性：客户端与服务器之间传送数据采用的方式，既输入的表单信息提交方式。 取值为： methed = post 用于表单的传输 methed = get 用于url参数的传递
3
表单页面 2、用户的输入标签<input> type属性：输入方式 （1）文本、密码
用于接受任何格式的文本、数字和字符。当类型是密码时文字等以******显示。 type = text（文本）或password（密码） 其他属性： name属性：可在程序中使用的名称，用以指定表单对象。 value属性：用来输入文本框的初始内容。 size属性：文本框宽度，即可显示字符的最多个数。 maxlength属性：允许输入的字符个数，可以比文本框宽度大。
4
表单页面 （2）单选框 2、用户的输入标签<input> 单项选择功能。多个选项之中只有一个选项被选中。
type = radio 其他属性： name属性：可在程序中使用的名称，用以指定表单对象。 value属性：将该值传递到服务器端。 check属性：此框被选中。 注意：在一个表单内只能有一个单选框为check，设置多个无效。
5
表单页面 （3）复选框 2、用户的输入标签<input> 多项选择功能。多个选项之中允许多项被选中。
type = checkbox 其他属性： name属性：可在程序中使用的名称，用以指定表单对象。 value属性：将该值传递到服务器端。 check属性：此框被选中。
6
表单页面 2、用户的输入标签<input> （4）重置按钮：清空表单的内容，恢复初始状态。 type = reset 其他属性：
name属性：可在程序中使用的名称，用以指定表单对象。 value属性：用来显示按钮上的文字。
7
表单页面 2、用户的输入标签<input> （5）提交按钮：向服务器提交整个表单。 type = submit 其他属性：
name属性：可在程序中使用的名称，用以指定表单对象。 value属性：用来显示按钮上的文字。
8
表单页面 3、列表、菜单选项标签<select> 将多个选项放在一个带滚动条的列表框内。
name属性：可在程序中使用的名称，用以指定表单对象。 size属性：列表的高度，即显示的行数。 multiple属性：表示列表中的各选项可以同时多选。 列表、菜单内部有嵌套标签<option>：表示各个列表项。
9
表单页面 4、文本区域标签<textarea> 用于接受任何格式的文本、数字和字符。可以以多行显示。 其他属性：
name属性：可在程序中使用的名称，用以指定表单对象。 rows属性：控制输入文本框的行数。 cols属性：允许输入的字符个数，可以比文本框宽度大。 wrap属性：控制换行。 wrap = off 输入的文字超过文本框的宽度时，不换行，出现滚动条 wrap = virtual 输入的文字超过文本框的宽度时，自动换行，但向服务器传输数据时无回车符。 wrap = physical 输入的文字超过文本框的宽度时，自动加入回车符，换行。
10
表单页面 表单页面 代码如下： <html> <head>
<title>表单</title> </head> <body > <form name="form1" method="post" action=""> <p align="left">调查表</p> <p align="left">姓名： <input name="textfield" type="text" value="填写你的真实姓名" size="20" maxlength="10"> 性别： 男 <input name="radiobutton" type="radio" value="男" checked> 女 <input type="radio" name="radiobutton" value="女"> </p> <p align="left">密码：
11
表单页面 表单页面 代码如下： <input name="textfield2" type="password" value="123456" size="6" maxlength="6"> 爱好： <input name="checkbox4" type="checkbox" value="checkbox" checked> 体育 <input type="checkbox" name="checkbox5" value="checkbox"> 文艺 <input type="checkbox" name="checkbox6" value="checkbox"> 旅游 </p> <p align="left">学历： <select name="menu3" onChange="MM_jumpMenu('parent',this,0)"> <option>研究生</option> <option>大学本科</option> <option selected>大学专科</option> <option>中专</option> <option>高中</option> <option>初中</option> <option>小学</option> <option>文盲</option>
12
表单页面 表单页面 代码如下： </select> 意见：
<textarea name="textfield3" cols="4" rows="3" wrap="PHYSICAL">在这里填写意见 </textarea> </p> <p align="left"> <input type="submit" name="Submit" value="提交"> <input type="reset" name="Submit2" value="重置"> </form> </body> </html>
Similar presentations
