form的使用
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!-- form:表单标签，用于创建一个表单，收集用户输入的数据，并提交给服务器程序
属性:action:指定将表单的数据发送到哪个服务器程序
method:指定用哪种方式来提交数据，常用值有GET,POST，默认值是get
表单域：又叫表单元素，作用是收集用户输入的数据 ，并提交给服务器端程序
常用的表单域：
1.input元素：它的type属性有不同值，表现出不同形态
type="text":表示文本框，提供文本的输入
type="radio":单选框(单选按钮)， 多个单选框的name值必须相同，如果name不同则不能互斥，
提交时是提交value值
type="checkbox":复选框，当name相同时，可以提交多个值(value属性的值)
type="file"":文件域，让用户选择本地文件上传到服务器
type="hidden":隐藏域，对用户不可见的元素，可以有默认值并且能提交给服务器(在javaEE开发中会大量使用隐藏域)
2. select元素：表示下拉列表，又叫下拉框，在下拉列表中用option元素定义待选择的选项，默认第1个选项被选中，
设置某个option被选中： 在option元素上添加selected="selected"或者selected
设置下拉列表为多选下拉列表：在select元素上加multiple属性
关于选中元素的设置：
1)设置单选框或复选框被选中的属性是checked
2)设置下拉列表的某个选项被选中的属性是selected
3. textarea:文本域，又叫多行文本框,cols是文本区内的宽度,rows:行数
placeholder：用来设置单行文本框(不是textarea)里的默认提示文字，当输入了新的内容后，该提示文字就消失了
4.label：本身没有什么效果，当结合单选按钮或复选框使用时，如果label的for属性和按钮的id相同，则点击
label后就相当于点击了按钮，会将单选框或复选框选中
表单按钮：
1.提交按钮： <input type="submit">，提交按钮作用是将表单数据发送到action指定的服务器上
2.重置按钮： <input type="reset">，作用是将表单中数据清空
3.普通按钮：<input type="button">，普通按钮在没有添加js代码情况下，是不能提交表单的
-->
<form action="test.html" method="get">
用户名：<input type="text" name="username" placeholder="请输入用户名"/><br> 密码：
<input type="password" name="upwd" /><br> 性别：
<input type="radio" name="sex" value="man" />男
<input type="radio" name="sex2" value="woman" checked/>女 爱好：
<input type="checkbox" name="hobby" value="sing" checked/>唱歌
<input type="checkbox" name="hobby" value="dance" />跳舞
<input type="checkbox" name="hobby" value="basketball" checked/>篮球
<input type="checkbox" name="hobby" value="football" />足球<br> 选择头像：
<input type="file" name="headImg" /><br> 隐藏域：
<input type="hidden" name="id" value="1234" /><br>
喜欢的城市：
<select multiple>
<option>北京</option>
<option>上海</option>
<option selected>天津</option>
<option selected>武汉</option>
</select><br>
个性签名：<textarea cols="50" rows="5">
我是个性签名
</textarea><br>
<label for="woman">
性别：
</label>
<input type="radio" name="sex" id="man" value="男"/>男
<input type="radio" name="sex" id="woman" value="女"/>女
<input type="submit" value="提交" />
<input type="reset" value="重置" />
<input type="button" value="普通按钮" />
<br>
<br>
</form>
</body>
</html>
7833
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
