动态网页制作教程第8章╲t 表单、行为和时间轴.ppt

一、创建表单 表单是用来收集浏览者输入的信息，使浏览者与网站进行交互的工具。 表单中有文本域、密码域、单选按钮、复选框、弹出菜单、可单击按钮等表单对象。 文本域 文本域接受任何类型的字母数字文本输入内容。 文本可以单行文本 还可以是多行文本 还可以以密码域的方式显示（输入文本将被替换为星号） 复选框 如果打算让用户可以从一组选项中选择多个选项，则可以使用复选框。 单选按钮 单选按钮通常成组地使用，在同一个组中的所有单选按钮必须具有相同的名称。 列表 / 菜单 通过列表/菜单，访问者可以从一个列表中选择一个或多个项目。 按钮 按钮对于表单必不可少，使用按钮可将表单数据提交到服务器，或者重置该表单的内容。 表单按钮通常带有“提交”、“重置”或“发送”标签。用户还可以分配其它已经在脚本中定义的处理任务。例如，按钮可以根据指定的值计算所选商品的总价。 隐藏域 可以使用隐藏域存储并向服务器提交数据信息，该信息对浏览者而言是隐藏的。一般用于脚本语言编程。执行“插入”|“表单”|“隐藏域”命令，或在“插入”栏上单击“隐藏域”按钮，就可以在表单中插入隐藏域。 跳转菜单 跳转菜单是可导航的列表或弹出菜单，这种菜单中的每个选项都链接到某个文档或文件。通过从列表中选择一项，用户将被重定向（或“跳转”）到指定的URL。 文件域 文件域包括一个单行文本字段及其右侧的“浏览”按钮，用于引用本地电脑上的文件作为表单内容 表单实例 【例8-1】 制作一个如图所示的表单网页的实例，演示对各种表单对象的综合应用。 操作提示： 为了方便表单 中内容的定位， 先在表单域中 插入一个12行 2列的表格。 二、行为、事件和动作的概念 行为是事件和由该事件触发的动作的组合。 事件是浏览器生成的消息，指示该页面的访问者执行了某种操作。 例如，当访问者将鼠标指针移动到某个超链接上时，浏览器为该超链接生成一个onMouseOver 事件。 动作是由预先编写的JavaScript 代码组成的，这些代码执行特定的任务，例如打开浏览器窗口、显示或隐藏层 等。 在Dreamweaver中为网页对象添加行为 在Dreamweaver 的“行为”面板中，用户可以先指定一个动作，然后指定触发该动作的事件，从而将行为添加到页面中。 常见浏览器事件 onLoad(装入一个文档):当浏览器完成装入一个窗口或一个帧集合中所有的帧时，产生该事件。 onunload(退出一个文档)：当Web页面退出时引发该事件。 onsubmit(提交一个表单对象):在完成信息输入，准备将信息提交给服务器处理时发生该事件。onReset(重置一个表单对象):当一个表单对象被提交以及被重置时，触发该事件。 常用鼠标事件 onMouseDown(按下鼠标):按下鼠标键时，发生该事件 onMouseMove(鼠标移动):移动鼠标时发生该事件。 onMouseOver(鼠标悬停):鼠标悬停在一个界面对象时发生该事件。 onMouseOut(鼠标滑出界面对象):当鼠标滑出一个界面对象时，发生该事件。 常用鼠标事件（续） onMouseUp(释放鼠标上一个键):释放鼠标按键时发生该事件。 onClick(单击一个对象):单击鼠标按钮时，产生该事件。 onFocus(获得焦点):当表单对象中的文本框对象、文本区域对象或者选择框对象获得焦点时，引发该事件。 onBlur(失去焦点):当表单对象中的文本输入框对象、文本输入区对象或者选择框对象不再拥有焦点时，引发该事件。 行为面板 使用行为面板可以将行为附加到页面元素（更具体地说是附加到标签），还可以修改以前所附加行为的参数。 执行“窗口”|“行为”命令，打开如图所示的“行为”面板。 更改行为 在附加了行为之后，用户可以更改触发动作的事件、添加或删除动作以及更改动作的参数。 三、使用行为制作具有动态效果的网页 使用Dreamweaver 自带的行为 Dreamweaver 自带的行为是为在Netscape Navigator 4.0 和更高版本以及InternetExplorer 4.0 和更高版本中使用而编写的。Dreamweaver 提供了很多自带行为，使用这些行为，能够制作出很多常见的页面动态效果。 弹出消息 “弹出消息”动作显示一个带有用户指定的消息的JavaScript 警告。因为JavaScript 警告只有一个按钮（“确定”），所以使用此动作可以起到提示的作用。 实例演示： 【例8-2】 在【例7-1】制作的网页中添加弹出消息动作，并将新文件保存为“example8-2.html”。 拖动层 “拖动层”动作允许网页访问者拖动层。利用层的拖动动作，可以移动层及其中的内容，从而实现某些特殊的页