七、表单

1. 概述

建立交互式的站点,需要使用 HTML 表单,它可以让用户提供信息,并对此作出处理。可以建立类似

复选框、单选按钮及文本框的控件。

掌握表单的使用对 Active Server Pages 编程是必需的。 ASP 脚本的一个主要功能是对 HTML 表单中

输入信息进行处理,因此,表单是 ASP 应用程序中主要的用户接口,学习表单有关知识,为以后的

ASP 学习奠定基础。

建立 HTML 表单,可以使用 <FORM> 标记,下面是简单的表单例子

<HTML>

<HEAD>

<Title>a simple example page -FORM [ 人文教程 ] </title>

</HEAD>

<BODY>

<FORM>

<INPUT>

</FORM>

<BODY>

</HTML>

当该文件在浏览器上显示时,一个三维外观的框显示在浏览器中 , 你可以在框中输入文字。但输入

文字后什么也不会发生。该表单没有实 际用途。

该例的问题是 : 表单不知道你已经输入信息完毕。解决这个问题,需要加入另一个表单元素:提交

按钮 submit 。下面的例子是同一个表单,只是加了一个 submit 按钮:

<HTML>

<HEAD>

<Title> a simple example page –FORM 表单 </Title>

</HEAD>

<BODY>

<FORM>

<INPUT>

<INPUT TYPE=Submit Value=” 确定 ”>

</FORM>

</BODY>

</HTML>

修改后文件,出现了“确定”文字的按钮,用鼠标点击这个按钮,通知浏览器-表单的文本框中已

输完信息。

表单将信息收集后,一般情况下,要将输入的信息交给一个后台的程序去处理,如何交给别的程序,

需要借助表单的 ACTION 属性

假如要将信息交给某个 ASP 程序 mypage.asp 来处理,可以这样写:

<HTML>

<HEAD>

<TITLE>a simple example page -FORM [ 人文教程 ] </ TITLE >

</HEAD>

<BODY >

<FORM ACTION =“ /somedirectory/mypage.asp ” METHOD= “ POST ” >

<INPUT>

<INPUT TYPE=SUBMIT VALUE=” 确定 ”>

</FORM>

</BODY>

</HTML>

在此例中, ACTION 和 METHOD 属性指明表单信息由名为 mypage.asp 的 Active Server Pages 程序去处

理。 ACTION 属性给出了 Active Server Pages 的路径, METHOD 属性指明表单信息通过何种方式送出。

例中,在文本框中输入的表单信息通过 post 方式送给 Active Server Pages 。

POST 容许传送大量数据,但 GET 则只接受低於 1K 的数据。

几乎所有情况, <FORM> 标记都和本例的用法一样,用 ACTION 指定处理表单的程序,并通过 METHOD 指定

表单信息发送方式。

在上例,还要加入一条语句才能使之实用。包含例如文本框之类的表单元素时, 应为每个表单元素起

一个名字。你可以通过 <INPUT> 的 NAME 属性来实现这一点。下面的例子有两个不同的文本框,分别叫

作 text1 和 text2 :

<HTML>

<HEAD>

<TITLE>a simple example page -FORM [ 人文教程 ] </ TITLE >

</HEAD>

<BODY >

<FORM ACTION =“ somedirectory/mypage.asp ” METHOD= “ Get ” >

<INPUT NAME=“text 1” >

<INPUT NAME=“text 2” >

<INPUT TYPE=SUBMIT VALUE=” 确定 ”>

</FORM>

</BODY>

</HTML>

例中,名为 text1 的文本框中输入的信息被传给程序处理时,将会与名字 text1 相关联,第一个文本

框中输入信息就与其它表单元素(文本框)中输入的信息区别开来。

表单信息将会送到在 ACTION 属性中指定的程序,信息包括用 & 符号分隔的名字和值。如果在第一个文

本框中输入 your first name ,在第二个文本框中输入 your last name ,则送去处理的信息将会是:

text1=yourfirstname&text2=yourlastname

事实上,在发送之前,表单信息要先编码。当文本编码后,文本被一些特定的字符替换了。例如,

空格符被加号( + )代替。因此如果你在第一个文本框中输入 This is textbox1 ,而在第二个文本框中

输入 This is textbox2 ,则下列的文本将会被送去处理:

text1=This+is+textbox1&text2=This+is+textbox2

在以后的 ASP 课程中,将学习如何处理这些又网页提交的信息。

2. 表单输入的形式

A. 单行文字框

Type  “ Text ” 能输入单行文字,上限为 255 字符

例 :

<input type ="Text" name ="age" value ="20" align ="MIDDLE" maxlength ="255">

name : 单行文字输入框的名字,由处理程序接收该框的信息。

Value : 单行文字框的初始值,可省略。

Align : 文字的位置,可选值: top, middle, bottom, left, right 。

Size: 限制输入框的宽度

Maxlength : 此一单行文字盒可输入字符的上限

例:

<form action=telphone.asp method="POST">

请填入电话号码: <input type="Text" name="telphone" value=" " Size=10 Maxlength="8">
</form>

B. 单选框

Type= “ Radio ” 给出单选按钮 ,能产生一个单选框,

例:

<input type= "Radio" name="country" value="US&ENGL" align="MIDDLE" checked>

checked : 设该 Radio 为内定被选。同 name 的各个 Radio 中只能有一个使用,或全不使用

例 :

<form action="Iraqwar.asp" method="POST"> 请选支持的国家:
<input type="Radio" name="country" value="US&ENGL"> 美英
<input type="Radio" name="country" value="IRAQ" checked > 伊拉克
<P> 您认为美英联军对伊拉克的战争是违背国际法吗?

<P>
<input type="Radio" name="like" value="Yes"> 是
<input type="Radio" name="like" value="No"> 不是
<input type="Radio" name="like" value="NotSure"> 不清楚
</form>

C. 复选框

Type = “ Checkbox ” , 能产生复选框,以供挑选

例如: <input type= "Checkbox" name="Car" value="JETTA" align="Middle" checked>

checked : 设该 Checkbox 为内定被选。每个 Checkbox 都是独立的,所以每一个都可使用这参数,不像 Radio 。

<form action=" Car.asp" method="POST">
<br> 你喜欢以下那些汽车:
<input type="Checkbox" name="Clik1" value="JETTA"> 捷达

<input type="Checkbox" name="Clik2" value="STN"> 桑塔纳

<input type="Checkbox" name="Clik3" value="TOYATA" > 丰田

<input type="Checkbox" name="Clike4" value="CHINA" checked> 中华

</form>

Type = “ Password ” , 能产生一文字框,输入的字符全以 * 号表示,其他参数和 Text 是完全相同的。

<form action=" Pwd.asp" method=" POST ">

请输入 ID : <input type="Text" name="name"> <br>
请输入密码: <input type="Password" name="pw" maxlength="9">

</form>

E 确认和重置按钮

表单的两个重要的输入按钮

Type=“ Submit ” 确认

Type=“ Reset ” 重置

例:

<input type="Submit" name="subm" value=" 确认 align="MIDDLE">

<input type="Reset" value=" 清除 " align="MIDDLE">

value=" 提交 " ,显示在按钮上,可以不用,确认的内定值为 Submit Query

value=" 清除 " 显示在按钮上,重置的内定值为 Reset

例:

<form action=" Car.asp" method="POST">

<br> 你喜欢以下那些汽车:

<input type="Checkbox" name="Clik1" value="JETTA"> 捷达

<input type="Checkbox" name="Clik2" value="STN"> 桑塔纳

<input type="Checkbox" name="Clik3" value="TOYATA" > 丰田

<input type="Checkbox" name="Clike4" value="CHINA" checked> 中华

<br><br>

<input type="Submit" name="subm" value=" 提交 "

align="MIDDLE">

<input type="Reset" value=" 清除 " align="MIDDLE">

</form>

F. 列表框 (Selectable Menu)

<select name=*>
<option> ...
</select>

<SELECT> 是列表框标记,列表中的选项由 <OPTION> 给出。

例:

<form action="citychoice.asp" method="POST"> Which city you like? 
<select name="Citylike">
< option value="cd"> 成都 </option>

<option value="sh" selected > 上海 </option>

<option value="sz"> 深圳 </option>

<option value="qd"> 青岛 </option>

<option value="km"> 昆明 </option>
</select>
</form>

selected : 表示该选项被预选

<form action="citychoice.asp" method="POST"> Which city you like?
<select name="Citylike" size=4 >
< option value="cd" selected > 成都 </option>

<option value="sh" > 上海 </option>
<option value="sz"> 深圳 </option>

<option value="qd"> 青岛 </option>

<option value="km"> 昆明 </option>
</select>
</form>

size=4: 列出选项的项数

<form action="citychoice.asp" method="POST"> Which city you like?
<select name="Citylike" size=4 multiple >
< option value="cd" selected > 成都 > </option>

<option value="sh"> 上海 </option>
<option value="sz"> 深圳 </option>

<option value="qd"> 青岛 </option>

<option value="km"> 昆明 </option>
</select>
</form>

multiple: 实 现列表中选项的多选,(用键盘的 Ctrl + 鼠标点击实现)

G. 文本区域

<textarea name=* rows=** cols=**> ... <textarea>

常用于填写较多文字的场合

<textarea name="comments" cols="40" rows="4">

name="comments" , 文字区域的名称,作识别之用,传到处理程序。

cols= "40" : 文字区域宽度 。

rows= "4" : 文字区域高度

例 :

<form action="notes.asp" method="POST">

请填入您的建议 :<p>

<textarea name="comments" cols="40" rows="4" >

这是预设的字句,可以什么都不写 </textarea>

</form>

八 . 嵌入多媒体流

1. 嵌入背景音乐 ( 仅适用于 IE)

<bgsound src=# loop=#2>

#1 音乐文件的 URL

#2 播放的循环数

<bgsound src=”http://202.115.4.176/zsecomer.wav” loop=2>

<bgsound src=”http://202.115.4.176/station.mp 3” >

2. 嵌入视频 ( 仅适用于 IE)

例 1

<img src=”url.gif” dynsrc=”url.avi”>

url.avi : 播放的视频文件

url.gif: 视频的封面,即:在浏览器尚未完全读入 AVI 文件时,

先在 AVI 播放区域显示该图象

<img src=”http://202.115.4.176/top.gif” dynsrc=

”http://202.115.4.176/Sample.avi”>

用鼠标控制播放

例 2

<img src= http://202.115.4.176/top.gif dynsrc=

"http://202.115.4.176/sample.avi"

start=mouseover >

start=mouseover: 鼠标移到 AVI 播放区域之上时才开始播放 AVI.

D. 密码框

 
HTML快速入门系列均系转载

HTML快速入门4的更多相关文章

  1. Web Api 入门实战 (快速入门+工具使用+不依赖IIS)

    平台之大势何人能挡? 带着你的Net飞奔吧!:http://www.cnblogs.com/dunitian/p/4822808.html 屁话我也就不多说了,什么简介的也省了,直接简单概括+demo ...

  2. SignalR快速入门 ~ 仿QQ即时聊天,消息推送,单聊,群聊,多群公聊(基础=》提升)

     SignalR快速入门 ~ 仿QQ即时聊天,消息推送,单聊,群聊,多群公聊(基础=>提升,5个Demo贯彻全篇,感兴趣的玩才是真的学) 官方demo:http://www.asp.net/si ...

  3. 前端开发小白必学技能—非关系数据库又像关系数据库的MongoDB快速入门命令(2)

    今天给大家道个歉,没有及时更新MongoDB快速入门的下篇,最近有点小忙,在此向博友们致歉.下面我将简单地说一下mongdb的一些基本命令以及我们日常开发过程中的一些问题.mongodb可以为我们提供 ...

  4. 【第三篇】ASP.NET MVC快速入门之安全策略(MVC5+EF6)

    目录 [第一篇]ASP.NET MVC快速入门之数据库操作(MVC5+EF6) [第二篇]ASP.NET MVC快速入门之数据注解(MVC5+EF6) [第三篇]ASP.NET MVC快速入门之安全策 ...

  5. 【番外篇】ASP.NET MVC快速入门之免费jQuery控件库(MVC5+EF6)

    目录 [第一篇]ASP.NET MVC快速入门之数据库操作(MVC5+EF6) [第二篇]ASP.NET MVC快速入门之数据注解(MVC5+EF6) [第三篇]ASP.NET MVC快速入门之安全策 ...

  6. Mybatis框架 的快速入门

    MyBatis 简介 什么是 MyBatis? MyBatis 是支持普通 SQL 查询,存储过程和高级映射的优秀持久层框架.MyBatis 消除 了几乎所有的 JDBC 代码和参数的手工设置以及结果 ...

  7. grunt快速入门

    快速入门 Grunt和 Grunt 插件是通过 npm 安装并管理的,npm是 Node.js 的包管理器. Grunt 0.4.x 必须配合Node.js >= 0.8.0版本使用.:奇数版本 ...

  8. 【第一篇】ASP.NET MVC快速入门之数据库操作(MVC5+EF6)

    目录 [第一篇]ASP.NET MVC快速入门之数据库操作(MVC5+EF6) [第二篇]ASP.NET MVC快速入门之数据注解(MVC5+EF6) [第三篇]ASP.NET MVC快速入门之安全策 ...

  9. 【第四篇】ASP.NET MVC快速入门之完整示例(MVC5+EF6)

    目录 [第一篇]ASP.NET MVC快速入门之数据库操作(MVC5+EF6) [第二篇]ASP.NET MVC快速入门之数据注解(MVC5+EF6) [第三篇]ASP.NET MVC快速入门之安全策 ...

  10. Vue.js 快速入门

    什么是Vue.js vue是法语中视图的意思,Vue.js是一个轻巧.高性能.可组件化的MVVM库,同时拥有非常容易上手的API.作者是尤雨溪,写下这篇文章时vue.js版本为1.0.7 准备 我推荐 ...

随机推荐

  1. ThinkPHP中简单的CURD操作

    前言 我们通过一个简答例子来简述CURD的操作.首先看一下数据库的样子,其中id为自增行,其它是varchar 一.查询操作 首先,创建在Controller文件夹下创建一个User控制器,在该控制器 ...

  2. 小记:Quartz 当 Job 执行时间超过触发间隔时间时所发生的情况

    一个普通的 Job 实现如下: public class Job1 : IJob { public void Execute(IJobExecutionContext context) { Conso ...

  3. jquery事件的区别

    1. mouseenter 和 mouseover  (mouseleave 和 mouseout) 前者鼠标进入当前元素触发,内部的子元素不会触发事件. 而后者是进入当前元素后,当前元素和内部的子元 ...

  4. Spring aop的实现原理

    简介 前段时间写的java设计模式--代理模式,最近在看Spring Aop的时候,觉得于代理模式应该有密切的联系,于是决定了解下Spring Aop的实现原理. 说起AOP就不得不说下OOP了,OO ...

  5. Error: java.lang.UnsatisfiedLinkError: no ntvinv in java.library.path

    Error Message When compiling or executing a Java application that uses the ArcObjects Java API, the ...

  6. OpenLayers中地图缩放级别的设置方法

    来源于:http://www.cnblogs.com/sailheart/archive/2011/03/15/1984519.html 一.概述 在OpenLayers中,地图必须具有一个缩放级别的 ...

  7. [转载]VS2012编译C语言scanf函数error的解决方法

    在VS 2012 中编译 C 语言项目,如果使用了 scanf 函数,编译时便会提示如下错误: error C4996: 'scanf': This function or variable may ...

  8. WEB中的cookie

    首先来一篇好文章,刚好看到的: 沉默中的狂怒 —— Cookie 大喷发---------------- http://www.cnblogs.com/index-html/p/mitm-cookie ...

  9. javaIO(三)

  10. 通过HTTP协议实现多线程下载

    1. 基本原理,每条线程从文件不同的位置开始下载,最后合并出完整的数据. 2. 使用多线程下载的好处     下载速度快.为什么呢?很好理解,以往我是一条线程在服务器上下载.也就是说,对应在服务器上, ...