表单
<form> 是一个表单,里面包含表单元素,例如文本表单,密码表单,单选框,复选框,提交按钮,下拉列表等。
表单<from>
<form> 是在最外层,主要向服务器提交数据的功能。
属性 | 值 | 说明 |
---|---|---|
accept-charset | 字符集 | 规定服务器处理的表单字符集 |
action | URL | 规定表单向何处发送表单数据 |
autocomplete | on或者off | 浏览器基于之前键入过的值,应该显示出在字段中填写的选项,实现自动填充 |
enctype | 编码格式 | 规定在向服务器发送表单数据之前如何对其进行编码。适用于 method=“post” |
method | get或者post | 规定发送表单数据的http方法 |
name | text文本 | 规定表单的名称 |
novalidate | novalidate | 使用该属性,则提交表单不进行验证 |
输入框
<input> 表示用户输入数据的文本域,输入框有多种形式,由type属性实现。
该标签没有结束标签。
属性:
属性 | 值 | 说明 |
---|---|---|
autocomplete | on或者off | 是否依据以前的输入完成自动输入 |
autofocus | autofocus | 页面加载时自动获得焦点 |
checked | checked | checked 属性规定在页面加载时应该被预先选定的 <input> 元素。 只针对 type=“checkbox” 或者 type=“radio”。 |
disabled | disabled | 允许禁用input元素 |
form | form标签的id值 | 规定input元素所属哪一个或者多个form表单 |
max | number | 规定input元素数值的最大值 |
min | number | 规定input元素数值的最小值 |
maxlength | number | 规定input元素的最大字符数 |
name | text | 规定input元素的名称 |
placeholder | text | 规定input输入前的提示信息 |
readonly | readonly | 规定input元素的字段是只读的 |
required | required | 规定在提交表单之前必须输入字段 |
type | 类型 | 规定input元素的类型 |
value | text | 规定input元素的value值 |
<input type="text"><br>
<input type="submit"><br>
<input type="button" value="button按钮"><br>
<input type="radio"><br>
<input type="checkbox"><br>
<input type="password"><br>
<input type="text" placeholder="请输入数据"><br>
<input type="text" value="这个字段自动默认化"><br>
<input type="text" readonly="readonly" value="nihao"><br>
文本域
<textarea> 标签定义一个文本区域,该标签是一个闭合标签。可以容纳无限数量的文本。
属性:
属性 | 值 | 说明 |
---|---|---|
autofocus | autofocus | 当页面加载时自动获得焦点 |
disabled | disabled | 禁用文本区域 |
form | form表单的id值 | 规定属于一个或多个的表单 |
maxlength | number | 规定文本区域的最大字符数 |
name | text | 规定文本区域的名称 |
placeholder | text | 定义一个简短的提示,两个标签不能有空格,不然不会显示 |
readonly | readonly | 规定文本只读 |
required | required | 在表单提交时文本域必须写 |
wrap | hardsoft | 当文本达到最大值时怎样换行 |
通过css样式的resize属性的none值解决默认伸缩样式。
<label>标签
<label>标签可以为input定义标注,该标签没有任何效果,只是为用户提供方便,在点击此标签时就会聚焦到相关的表单上。该标签的for属性要与相关元素的id属性相同。
<label for="n">跳转到input元素上</label>
<br>
<br>
<input type="text" id="n">
下拉列表
<select> 表示下拉列表,该标签只是定义下拉列表, <option> 定义列表中的可选项。
select属性:
属性 | 值 | 说明 |
---|---|---|
autofocus | autofocus | 页面加载自动获得焦点 |
disabled | disabled | 禁用下拉列表 |
form | form-id | 所属一个或多个form表单 |
multiple | multiple | 可以选择多个选项,只是展示 |
name | text | 定义下拉列表的名称 |
required | required | 规定在提交表单时必须选择一个选项 |
size | number | 规定下拉列表可见选项的数目 |
option属性:
属性 | 值 | 说明 |
---|---|---|
disabled | disabled | 该选项首次加载时被禁用 |
selected | selected | 首次加载时选中此选项 |
value | text | 推送服务器的选项值 |
button按钮
<button> 表示一个按钮,它是一个闭合标签,里面可以放置文本,图像等。与input元素的按钮大不相同。请始终都要为button元素添加type属性。
属性:
属性 | 值 | 说明 |
---|---|---|
autofocus | autofocus | 当页面加载自动获得焦点 |
disabled | disabled | 禁用该按钮 |
form | form_id | 属于一个或者多个form表单 |
大部分属性与表单的属性差不多。