




已阅读5页,还剩6页未读, 继续免费阅读
版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领
文档简介
.,1,网页设计与制作教程(HTML+CSS+JavaScript),机械工业出版社同名教材配套电子教案,.,2,2.1 表单的工作原理2.2 表单标签2.3 表单元素2.4 表单的高级用法,第2章 表单,.,3,表单的作用是从客户端收集信息。当访问者在表单中输入信息,单击提交按钮后,这些信息将被发送到服务器,服务器端脚本或应用程序将对这些信息进行处理。服务器进行响应时,会将被请求信息发送回用户(或客户端),或者基于该表单内容执行一些操作,表单的工作原理如图2-1所示。,2.1 表单的工作原理,.,4,网页上具有可输入表项及项目选择等控制所组成的栏目称为表单。标签用于创建供用户输入的HTML表单。表单的基本语法及格式为: ,2.2 表单标签,.,5,2.3.1 元素 元素用来定义用户输入数据的输入字段,根据不同的type属性,输入字段可以是文本字段、密码字段、复选框、单选按钮、按钮、隐藏域、电子邮件、日期时间、数值、范围、图像、文件等。元素的基本语法及格式为:,2.3 表单元素,.,6,【演练2-1】制作商品图片上传的表单页面,使用文件域上传文件,用户单击“浏览”按钮后,将弹出“打开”对话框。选择文件后,路径将显示在地址文本框中。,2.3 表单元素,.,7,2.3.2 选择栏选择栏可分为两种:弹出式和字段式。标签的格式为: 标签的格式为: ,2.3 表单元素,.,8,2.3.3 多行文本域 在意见反馈栏中往往需要浏览者发表意见和建议,且提供的输入区域一般较大,可以输入较多的文字。使用标签可以设置允许成段文字的输入,格式为: 多行文本 其中的行数和列数是指不拖动滚动条就可看到的部分。,2.3 表单元素,.,9,在某些情况下,用户需要对表单元素进行限制,设置表单元素为只读或禁用,常应用于以下场景:只读场景:网站服务器不希望用户修改的数据,这些数据在表单元素中显示。例如,注册或交易协议、商品价格等。禁用场景:只有满足某个条件后,才能选用某项功能。例如,只有用户同意注册协议后,才允许单击“注册”按钮。只读和禁用效果分别通过设置“readonly”和“disabled”属性来实现。【演练2-2】制作商城服务协议页面,页面浏览后,商城服务协议只能阅读而不能修改,并且只有用户同意注册协议后,才允许单击“注册”按钮。,2.4 表单的高级用法,.,10,制作商城“会员注册”表单页面,使用表单技术制作会员注册页面,收集会员的个人资料。首先显示未注册前的初始页面,如图2-4(a)所示;用户可以通过美观便捷的日期选择器设置会员的生日,如图2-4(b)所示;接下来输入完整的会员信息,其中输入的电子邮件地址格式不正确,然后单击“提交”按钮,如图2-4(c)所示;表单提交后,检查出电子邮件地址无效,如图2-4
温馨提示
- 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
- 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
- 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
- 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
- 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
- 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
- 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
最新文档
- 2025年靶点发现与验证技术在创新药物研发中的生物信息学伦理问题报告
- 门店出售协议合同书模板
- 高效的对赌协议合同模板
- 机械加工厂劳务合同范本
- 签订合同后主体变更协议
- 精装修房子购买合同范本
- 甲方如何写合同协议模板
- 村委与贫困户养殖协议书
- 签了认购协议被动签合同
- 电源安装工程合同协议书
- 苏教版四年级下册数学计算题每日一练带答案(共20天)
- 江苏连云港某公司“12.9”爆炸事故报告
- 人教版三年级上下数学试卷合集-综合素质训练
- 沥青混凝土质量保证体系及措施
- 钢筋机械连接技术规程 JGJ 107-2016
- 《亚马逊运营知识》课件
- 农业机械的智能控制
- 克莱德贝尔格曼吹灰器说明书(Jetblower)
- 2024国际技术转让合同(中英文对照)
- 中华人民共和国能源法
- GB/T 3487-2024乘用车轮辋规格系列
评论
0/150
提交评论