Day4_HTML+CSS+JS——单选按钮、复选框、下拉列表、文件表单项和隐藏表单项

一. 储备知识

radio单选按钮：

1. 由于用户不能输入内容，所以必须设置value值
2. 多个单选按钮如果希望是一组之间有互斥关系，name属性值必须相同
3. checked=“checked”可以设置单选按钮选中状态
   例子：

 性别：男<input type="radio" name="gender" value="man">
       女<input type="radio" name="gender" value="girl">

checkbox多选按钮复选框：

1.用户不能输入内容，需要提供value属性值
2.多个复选框，name属性值相同为同一组复选框
3. checked=“checked”可以设置多选按钮选中状态
例子：

  爱好：足球<input type="checkbox" name="hobby" value="足球">
       篮球<input type="checkbox" name="hobby" value="篮球">
	   排球<input type="checkbox" name="hobby" value="排球">
	   跑步<input type="checkbox" name="hobby" value="跑步">

select下拉列表：

1.option用来创建一个下拉列表项
2.有name属性才会被表单项收集
例子：

喜欢的明星：   <select>
                       <option>杨幂</option>
                       <option>刘亦菲</option>
                       <option>小马哥</option>
                       <option>彭于晏</option>
               </select>

file文件表单项：

1.用来上传文件
例子：

   头像：<input type="file" name="img" value="picture">

hidden隐藏表单项：

1.没有显示效果，服务器一般希望用户能够偷偷提交数据却不希望用户知道
例子：

  <input type="hidden" name="hiddenContent" value="content">