1.表单
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>表单</title>
</head>
<body>
<h1>表单--包含表单元素，用来采集用户信息，可以将采集的信息交给后端处理程序处理的html元素</h1>
<h2>form表示表单</h2>
<h3>action---设置后端处理程序的地址路径</h3>
<h3>method---请求提交方式[get(默认)/post]</h3>
<h4>get(默认)--表单元素中的数据值会以键值对的形式追随在后端处理程序的地址路径后面<br>
有数据量限制255个字符</h4>
<h4>post---将采集的信息数据封装到网络协议中发送给后端处理程序。<br>
没有数据量限制</h4>
<h4>enctype---规定在将表单数据发送到后台处理程序之前如何对其进行编码</h4>
<h5>application/x-www-form-urlencoded----默认。在发送前对所有字符进行编码</h5>
<h5>multipart/form-data----不对字符编码</h5>
<h5>text/plain----将空格转换为 "+" 符号，但不编码特殊字符</h5>
<h1>文件上传时method一定时post,一定有enctype属性且取值一定是multipart/form-data</h1>
<form action="regist" method="post" enctype="application/x-www-form-urlencoded">
<input type="text" name="myname">
<input type="submit" value="tijiao">
</form>
</body>
</html>
2.表单元素
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>表单元素</title>
</head>
<body>
<form action="test" method="get" >
<table border="1px">
<tr>
<td>元素名称</td><td>元素形式</td><td>注意事项</td>
</tr>
<tr>
<td>文本框</td>
<td><input type="text" name="mytext" value="文本框"></td>
<td>type--input元素的类型text<br>
name--元素名称<br>
value---默认值
</td>
</tr>
<tr>
<td>密码框</td>
<td><input type="password" name="mypassword" value="密码框"></td>
<td>type--input元素的类型password<br>
name--元素名称<br>
value---默认值
</td>
</tr>
<tr>
<td>单选按钮</td>
<td><input type="radio" name="mysex" value="nan">男
<input type="radio" name="mysex" value="nv" checked="checked">女</td>
<td>type--input元素的类型radio<br>
name--元素名称,有多个单选按钮时，为了保证每次只能选一个，要求name属性值要相同<br>
value---提交到后台的数据值。<br>
checked="checked"设置默认被选中。
</td>
</tr>
<tr>
<td>复选框</td>
<td><input type="checkbox" name="mycheckbox" value="zu">足球
<input type="checkbox" name="mycheckbox" value="lan" checked="checked">蓝球
<input type="checkbox" name="mycheckbox" value="pai" checked="checked">排球
<input type="checkbox" name="mycheckbox" value="ping" checked="checked">乒乓球</td>
<td>type--input元素的类型checkbox<br>
name--元素名称,有多个复选框时，为了保证每次能选多个，要求name属性值要相同<br>
value---提交到后台的数据值。<br>
checked="checked"设置默认被选中。
</td>
</tr>
<tr>
<td>日期框</td>
<td><input type="date" name="mydate">
<input type="time" name="mytime">
<input type="datetime-local" name="mydatetime"></td>
<td>type--input元素的类型date[日期] time[时分] datetime-local[日期时分]<br>
name--元素名称
</td>
</tr>
<tr>
<td>文件框</td>
<td><input type="file" name="myfile"></td>
<td>type--input元素的类型file<br>
name--元素名称<br>
上传文件时用来选中被上传的文件用的
</td>
</tr>
<tr>
<td>隐藏域</td>
<td><input type="hidden" name="myhidden" value="testvalue"></td>
<td>type--input元素的类型hidden<br>
name--元素名称<br>
value--隐藏域提交给后端程序的数据值<br>
不会显示出来，可以向后端程序提交数据【偷摸】
</td>
</tr>
<tr>
<td>颜色框</td>
<td><input type="color" name="mycolor" ></td>
<td>type--input元素的类型color<br>
name--元素名称<br>
</td>
</tr>
<tr>
<td>邮箱</td>
<td><input type="email" name="myemail" ></td>
<td>type--input元素的类型email<br>
name--元素名称<br>
提交是会被进行格式校验
</td>
</tr>
<tr>
<td>电话</td>
<td><input type="tel" name="mytel" ></td>
<td>type--input元素的类型tel<br>
name--元素名称<br>
</td>
</tr>
<tr>
<td>网址</td>
<td><input type="url" name="myurl" ></td>
<td>type--input元素的类型url<br>
name--元素名称<br>
提交是会被进行格式校验
</td>
</tr>
<tr>
<td>普通按钮</td>
<td><input type="button" value="普通按钮" οnclick="alert('hello');"></td>
<td>type--input元素的类型button<br>
value--按钮上的文字<br>
οnclick="alert('hello');"--为按钮设置的单击事件
</td>
</tr>
<tr>
<td>提交按钮</td>
<td><input type="submit" value="提交" ></td>
<td>type--input元素的类型submit<br>
value--按钮上的文字
</td>
</tr>
<tr>
<td>重置按钮</td>
<td><input type="reset" value="重置按钮"></td>
<td>type--input元素的类型reset<br>
value--按钮上的文字<br>
重置到初始状态
</td>
</tr>
<tr>
<td>下拉列表</td>
<td>
<select name="myselect">
<option value="xian">西安市</option>
<option value="baoji">宝鸡市</option>
<option value="tongchuan">铜川市</option>
<option value="yanan">延安市</option>
</select>
</td>
<td>select--下拉列表<br>
name--元素名称<br>
option--下拉列表中的每一项<br>
value---提交到后台的数据值。
</td>
</tr>
<tr>
<td>文本域</td>
<td>
<textarea cols="50" rows="5"></textarea>
</td>
<td>textarea--文本域<br>
cols--列数设置宽度<br>
rows--行数设置高度<br>
输入超过大小空间之后自带滚动条
</td>
</tr>
</table>
</form>
</body>
</html>
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
