第3讲表格与表单(3363KB).ppt

* * * * * * * * * * * * * 表单元素的逐一介绍8-6 文件域 ...... pinput type=file name=files /br / input type=submit name=upload value=上传 //p …… 显示上传文件的地址 操作演示：文件域应用 input type=file name= … 小结 前面所学的各类表单元素，语法分别是什么？ type 功能 例子 text 单行文本输入 input type=text name=username / password 密码 input type=password name=password / radio 单选 input type=radio name=sex value=男 /男 input type=radio name=sex value=女 /女 checkbox 多选 input type=checkbox name=hobby value=书 /书 input type=checkbox name=hobby value=画 /画 reset 重置表单数据 input type=reset value=重置 / file 文件上传 input type=file name=files / submit 提交表单数据 input type=submit value=提交 / image 图形提交按钮 input type=image src=images/button.gif / button 普通按钮 input type=button value=播放音乐 / 表单元素的逐一介绍8-7 列表框 ...... select name=bmon option value= selected=selected[选择月份]/option option value=0一月/option option value=1二月/option option value=2三月/option option value=3四月/option /select …… 提供固定选项，避免用户输入错误 操作演示：列表框应用 select name=指定列表名称 size=行数 option value=选项值 selected=selected…/option … … /select 表单元素的逐一介绍8-8 多行文本框 ...... h2img src=images/read.gif alt=阅读协议 title=阅读协议 / 阅读贵美网服务协议 /h2 ptextarea name=textarea cols=40 rows=6 欢迎阅读服务条款协议... /textarea/p …… 操作演示：多行文本框应用 textarea name=... cols=列宽 rows=行宽 文本内容 /textarea 本讲内容 表单的基本语法 表单的元素 表单的高级用法 表单的高级用法 只读和禁用属性 readonly：希望某个框内的内容只允许用户看，不能修改 disabled：因没达到使用的条件，限制用户使用 textarea name=content cols=60 rows=8 readonly=readonly 欢迎阅读服务条款协议，贵美的权利和义务...... /textareabr /br / 同意以上协议input name=agree type=checkbox / input name=btn type=submit value=注册 disabled=disabled / /p…… 1、用户不能修改协议 2、勾选“同意以上协议”，才允许点击“注册”按钮 操作演示：只读和禁用属性 练习——简易求职表 需求说明： 使用表单制作简易求职表 “协议”只读，“提交”按钮禁用 用隐藏域提交求职者姓名“zhangsan” 总结 表单form的基本语法 ？ 表单元素有哪些，语法分别是什么 ？ 如何设置表单元素的只读和禁用属性 ？ * * * * * * * * * * * * * * * * * * * * * * * * 第3讲 表格与表单 潘俊 panjun@wzu.edu.cn Phone:QQ:办公室：北7-1202-C 网页与JavaScript语言 本讲任务1 制作表格图文布局--公告栏页面 制作表格布局表单页面--登录页面 本讲单词1