表单元素
<form>:用于生成输入表单,该元素不可视化
action:指定当前表单提交的地址,必填
method:指定提交表单时发送何种类型的请求,post或者get,一般post,必填;其中GET方式可以在地址栏种看到传送的数据,POST方法看不到较安全
enctype:指定对表单内容进行编码的字符集
name:名称
target:以何种方式打开目标url,_self,_blank,_top,_parent四个中的一个
<input>:
type=
text:单行文本框
password:密码输入框
hidden:隐藏域
radio:单选框
checkbox:复选框
image:图像域
file:文件上传域
submit,reset,button:———
checked:设置单选框复选框的选中状态
disabled:表示元素被禁用
maxlength:指定文本框中所允许输入的最大字符数
readonly:表示不允许用户修改
size:指定元素的宽度
src:指定图像域所显示图像的URL
<label>:定义标签
for:表示所相关联表单控件的id值
<button>:定义一个按钮
disable:指定是否禁用按钮
name:指定唯一名称,一般与id值相同
type:指定按钮类型,button,reset,submit其中之一
value:指定按钮的初始值
<select>:创建列表框和下拉菜单,必须和<option>结合使用
multiple:允许多选
size:设置该列表框的高度
<option>表示一个列表项或者菜单项
<optgroup>用于定义列表项或者菜单项,只能包含<option>
<textarea>:设置多行文本框
cols:指定文本域的宽度,必填
rows:指定文本框的高度,必填
disabled:禁用此文本域
readonly:设置为只读
HTML5新增表单中的属性与元素
1、为表单控件添加了form属性,form=“一个form表单的id”,则它也属于这个表单的,当提交表单时,此控件也会提交相关参数
2、formaction:对按钮设置不同的formaction则会提交到不同的对应逻辑
3、formXXXX属性:formenctype,formmethod,formtarget通过这些属性均可以让按钮动态的改变表单的相关属性
4、autofocus属性:自动获得焦点
5、placeholder属性:文本框中的灰色字体提示信息
6、list与datalist属性:文本框中类似历史记录的东西
7、autocomplete属性:为on则会显示datalist下拉菜单,off则不会显示datalist下拉菜单
8、<output>元素:用于显示输出,比如计算结果或者脚本的输出,必须属于某个表单;使用for属性来表示显示那个元素的值(本次未显示出output数据)
9、type=“file”,允许进行多个文件的上传,accept:控制允许上传文件的类型;multiple:设置是否允许选择多个文件。
<input>中的type=:
color:颜色选择器
date:日期选择器
time:时间选择器
datetime:UTC日期、时间选择器
datetime-local:本地日期、时间选择器
week:供用户选择第几周的文本框
month:月份选择器
email:Email输入框,需要符合emaile的格式
tel:只能输入电话号码的输入框,输入任意字符串
url:URL输入框
number:只能输入数字的数字输入框
range:拖动条,min设置最小值,max设置最大值,step设置步长
search:专门用于搜索的文本框,与type=“text”无太大区别
使用FileReader获取文件内容
readAsText(file,encoding):以文本方式来读取文件,encoding为编码方式,默认为utf-8。
readAsBinaryString(file):以二进制方式来读取文件,这样就可以通过Ajax方式来上传至服务器。
readAsDataURL(file):以DataURL方式来读取文件
abort():停止读取
onloadstart:开始读取数据时,触发该事件指定的函数
onprogress:正在读取时,触发该事件指定的函数
onload:成功读取数据后,触发该事件的函数
onloadend:读取数据完成后,无论成功与失败,都触发该事件指定的函数
onerror:读取失败时,触发该事件指定的函数
<progress>可以用来显示文件的读取进度
HTML5新增的客户端校验
require:指定该控件必须填写
pattern:此控件的值必须符合指定的正则表达式
min,max,step
调用checkValidity方法来进行校验
使用setCustomValidity来自定义错误提示
HTML笔记三,表单相关元素和属性
原文:http://www.cnblogs.com/likaopu/p/5149638.html