- 1、本文档共16页,可阅读全部内容。
- 2、原创力文档(book118)网站文档一经付费(服务费),不意味着购买了该文档的版权,仅供个人/单位学习、研究之用,不得用于商业用途,未经授权,严禁复制、发行、汇编、翻译或者网络传播等,侵权必究。
- 3、本站所有内容均由合作方或网友上传,本站不对文档的完整性、权威性及其观点立场正确性做任何保证或承诺!文档内容仅供研究参考,付费前请自行鉴别。如您付费,意味着您自己接受本站规则且自行承担风险,本站不退款、不进行额外附加服务;查看《如何避免下载的几个坑》。如果您已付费下载过本站文档,您可以点击 这里二次下载。
- 4、如文档侵犯商业秘密、侵犯著作权、侵犯人身权等,请点击“版权申诉”(推荐),也可以打举报电话:400-050-0827(电话支持时间:9:00-18:30)。
- 5、该文档为VIP文档,如果想要下载,成为VIP会员后,下载免费。
- 6、成为VIP后,下载本文档将扣除1次下载权益。下载后,不支持退款、换文档。如有疑问请联系我们。
- 7、成为VIP后,您将拥有八大权益,权益包括:VIP文档下载权益、阅读免打扰、文档格式转换、高级专利检索、专属身份标志、高级客服、多端互通、版权登记。
- 8、VIP文档为合作方或网友上传,每下载1次, 网站将根据用户上传文档的质量评分、类型等,对文档贡献者给予高额补贴、流量扶持。如果你也想贡献VIP文档。上传文档
查看更多
《项目3主页的设计与制作四登陆界面
项目3 主页的设计与制作(四 管理员登录部分制作)
能力目标:
会在网页中制作表单
会使用JavaScript脚本代码完成客户端信息完整性的检查
会使用ASP内置对象来处理客户端提交的信息
能为表单加入验证码
会使用SQL语句检查用户名,完成登录验证
知识目标:
了解表单的一般工作流程
认识ASP的内置对象
理解SQL语句的使用方法
【任务1】 建立登录表单,并将表单提交给logincheck.asp处理,如图1所示。
图1 登录表单
【任务分析】
动态网站中实现信息的交互通过表单来完成。表单,在网页中起到为访问者与服务器之间交流架设平台的作用,访问者与服务器的交流是交互的,一方面通过表单,访问者可以使用诸如文本域、列表框、复选框以及单选按钮之类的表单对象输入信息,然后单击某个按钮提交这些信息。另一方面,服务器接收到这些信息后,调用脚本或应用程序对这些信息进行处理,并反馈给访问者。例如,在网上常见的申请免费邮箱页面,就是一个表单,访问者填写如用户名、密码、性别、爱好等相关信息后,按下“提交”按钮,提交给服务器进行处理,服务器端程序自动检查填写是否符合规范或用户名是否有重名等,并将信息反馈。除此以外,表单的通常应用有调查表、填写注册、电子商务订单和信息搜索等。
【操作步骤】
进入Dreamweaver,在站点文件夹ClassWeb下新建文件夹login,并在login文件夹下新建文件login.asp,双击login.asp文件,进入“设计”视图状态。
创建表单域
表单域,其作用就是把各对象作为一个整体进行处理,一个页面可以包含多个表单域,在同一表单域中的对象是一个整体,与另一个表单域中的对象一般是不相干的。创建表单域的步骤:
在插入工具栏中选择“表单”,以显示出表单工具栏(若没有出现插入工具栏,执行“窗口”→“插入”命令),如图2所示。
图2 插入工具栏中表单选项
单击【表单】按钮,即可以在页面中出来一个红色虚线围住的区域,就是表单域。 若没有看到创建的表单,通过“查看”/“可视化助理”/“不可见元素”命令,来隐藏或显示表单。
插入表格
光标定位于表单域中,执行“插入”→“表格”命令(或在插入工具栏中选择“常用”,单击【表格】按钮),将弹出“表格”对话框,如图3所示。
图3 表格对话框
输入行数和列数,以插入一个4行2列的表格。
选中表格,在表格属性面板设置表格的宽与高(根据主页效果图中管理员登录表单中切片的大小来确定),设置表格边框粗细为0,表格的背景色依据主页效果图中的效果来确定,在背景色或背景图像中进行设置,如图4所示。
图4 表格属性面板
在表格第一列中输入文字,在表格第二列中添加表单对象。在该任务中涉及到两类表单对象,各对象及其属性设置如下:
文本字段
文本字段的作用是提供访问者输入文字,如图中的“用户名”、“密码”和“验证码输入框。选中各文本字段,在属性面板中进行属性设置,如图5、图6和图7所示。
图5 “用户名”文本字段属性设置
图6 “密码”文本字段属性设置
图7“验证码”文本字段属性设置
文本域:即文本字段的名称(如图中的username),服务器端是根据该名称(变量)来获取输入的值的。
字符宽度:文本字段在页面占的位置宽度。
类型:分为单行、多行和密码。如选为密码,则访问者所输出字符均显示为“*”。
初始值:文本字段的初始值。
按钮
在表单中输入信息完毕,向服务器提交信息时使用,如“登录”、“重置”按钮。选中各按钮,在属性面板中进行属性设置如图8、图9所示。
图8“登录”按钮属性设置
图9 “重置”按钮属性设置
按钮名称:给按钮所取的名称。
值:按钮的标题,如“登录”、“重置”等。
动作:提交表单、重置表单、无三个单选项。
“提交表单”是将表单中所填入的内容提交给服务器处理。
“重置表单”则是清空表单中填入的内容。
选择“无”则既不提交也不重设,但可以执行给按钮指定的动作。
将表单提交给logincheck.asp处理
单击“设计”视图下方标签选择器处的“form#form1”,选中表单,在表单属性面板中进行属性设置。在“动作”框中输入“logincheck.asp”,“目标”框中输入“_parent”,如图10所示。
图10“表单”属性设置
【任务2】 使用JavaScript脚本代码完成客户端表单输入数据不能为空的检查
具体要求:当没有输入用户名,单击【登录】按钮时,弹出对话框提示“请输入用户名!”,如图11所示。当输入了用户名没有输入密码,单击【登录】按钮时,弹出对话框提示“请输入密码!”,如图12所示。当输入了用户名和密码,但没有输入验证码,单击【登录】按钮时,弹出对话框提示“请
文档评论(0)