徐枭雄课件FORM表单.docVIP

FORM表单 form/form用于为用户输入创建HTML表单。 Action--浏览者输入的数据被传送到的地方，比如一个PHP页面。 Method--数据传送的方式。 Get-- 次方式传递数据量较少，但是传递的信息可以显示到网址上 Post--此方式传送信息多，而且不会吧传递信息显示在网址上。（较为安全。） 例子：input type=”text” name=”” value=”” input /标签中常用的属性： Name--此表单项的名称 Value--当前输入域的默认值 Readonly--输入域可以选择，但是无法修改。 Disabled--输入域无法获取焦点，无法选择，以灰色显示。 Checked--可以设置单选框或者多选框默认选中。 Type---代表一个输入域的显示方法（分为输入型，选择型，点击型） 常用的输入型的值为： Text--普通文本输入域 Password--密码输入域 Hidden--代表隐藏域，可以传送一些隐藏的信息到服务器。 textarea/textarea大文本输入域 其中常用属性： Name：为该文本域定义名称 Rows:定义该文本域行的数目 Cols:定义该文本域列的数目 注意：默认值取以textarea开始到/textarea结束的内容。 常用的选择型的值为： File---可以选择一个文件路径 Radio--单选框，只可以选择一个而且必须选择一个 注意：单选按钮中只有name名称保持一致，才会产生排斥效果。 label/label标签为input元素定义标注（绑定元素） 注意：有两种可以，一种是使用label/label标签直接包含内容以及input标签。 另外一种格式。使用lable标签包含内容，然后使用属性for=“自己定一串字符” 。然后在input标签中 定义一个id属性，属性值也为=“与for相同的自定义一串字符” Checkbox--复选框，可以选择多个 select/select下拉列表 option/option列表项 注意：下拉列表中定义name属性名 列表项中定义默认值value Selected属性为该下拉列表默认选中项。 常用的点击型值为： Button--按钮-》没有任何意义，给以后JS提供的。 格式1： input type=”button” name=”” value=”按钮上显示的文字” 格式2： button type=”button”按钮上显示的文字/button Submit--提交按钮，表单填写完毕可以提交，把信息传动到服务器。 格式2： button提交按钮/button button type=”submit”提交按钮button Image--使用图片来显示提交按钮，使用src属性执行图像的位置。 其中还可以使用的属性有 Alt=”用于替代提交按钮的图片加载失败时显示的文字” Title=”鼠标移动到图片上显示的文字” Width=”设定图片的宽度” Height=”设定图片的高度” Reset--重置按钮，可以把表单中的信息清空(还原默认效果) HTML5： 定义可选数据列表datalist/datalist 列表项：option/option 如果进行关联： 需要给datalist标签中定义一个id,id的值为自定义的字符串，然后在普通文本域中添加一个属性list,list属性值就是id的属性值。 新增的表单类型type值： Email 设定当前表单的验证方式是EMAIL验证 URL 设定当前表单的验证方式URL验证 Number 设定当前表单的验证方式为数值验证 Range 设定当前表单的验证方式必须在指定范围内（滑块效果） 常用的属性： Min 最小值 Max 最大值 注意：value表示当前值 Search 设定当前表单为搜索表单 需要添加属性results=”n” 会在chrome下显示小放大镜的效果。 Color 设定当前表单为颜色选取框 tel 设定当前表单为电话号码表单 注意：该表单和text效果一样，电话没办法验证。唯一好处在手机端使用时，会自动弹出数字键盘，方便输入电话号。 日期时间类型 只有chrome支持 Date 表示日期选取表单 Time 表示时间选取表单 Week 周选取表单 一选就是一周 Month 月份选取表单 一选就是一个月 Datatime-local 完整的日期和时间，本地时间。 HTML5中表单的新玩法 表单分离技术： 在HTML5中为了排版方便，表单标签允许跳出form表单之外，但是要实现提交功能需要做2件事 为form标签添加唯一ID属性 为需要提交的元素添加form属性，指定1步骤的ID值即可。 了解：output/output 用于输入表单内的值（用来显示输出的）