一、表单
(1)表单的作用:与用户进行交互,提供表单元素让用户输入
(2)表单元素:
文本框(text): 单行,基本输入
列表框(select):提供多个项让用户选择
单选框(radio) :用户只能选择其中一项
复选框(checkbox):用户可以选择多项
密码框(password):输入敏感数据
文本域(textarea):多行文本
文件域(file): 让用户选择文件
注:输入(text,password,textArea),选择(select,radio,checkbox,file),按钮(button,submit,reset,image)
普通按钮: button
提交按钮: submit(将表单中用户输入的数据提交到服务器)
重置按钮: reset, 还原到初始状态(与清空近似)
图片提交按钮:image
隐藏域: hidden,隐式提交的数据,用户不可见
(3)表单标记:form
<form action="数据提交的地址" method="提交的方式">
...表单元素
</form>
注:1.一个网页中可以有多个form
2.表单元素需要写在form标记中
3.提交方式有post密文提交(例登录信息), get地址栏显示提交(例搜索引擎)
(4)表单元素标记:input,select,button,textarea
1.input
<input type="表单元素的类型" name="表单元素的名字" value="值" size="大小"maxlength="最大长度"
checked="true|false" src="图片提交按钮的路径"/>
注:a.文本域和列表框不能使用input标记
b.取名时尽量让名字有意义,例: chkLike= chk类型,like作用
c.单选框复选框同组的名字要相同
d.单选框和复选框的值不可见,只用于提交,例:<input type="radio" value="1"/>男
男是提示作用,1会提交到服务器
e.size是指宽度,maxlength允许输入的字数
f.checked用于单复选,是否选中,默认不选中
g.不带type,默认是文本框
2.texarea文本域
<textarea cols="总列数" rows="总行数" name="名字">值</textarea>
注:textarea没有value属性
值可以直接使用空格和回车
3.select...option列表框
<select name="sltShengfen">
<option>湖南</option>
<option>湖北</option>
<option selected="true">江西</option>
<option>江苏</option>
</select>
4.button按钮
<button type="reset|button|submit">内容</button>
注:<button>与<input>比较:
<button>更灵活,可以插图片和使用文字,也可局部设置格式
<input> 更通用,除了文本域和列表框,它都可实现
注2:省略type,默认为button
二、小知识:
1.<!--注释 -->
2.特殊符号 &开头;结束
< 表<
> 表>
表空格
" 表引号
© 版权符号
3.表单的readonly和disabled
(1)readonly用于输入框 ,disabled用于按钮
(2)readonly表示只读,disabled禁用
(3)如果文本框使用readonly表示只读,但数据可以提交
但使用disabled不仅是只读,框中数据不能被提交