HTML表单

HTML表单(form)

表单作用 ：与用户交互，把用户输入的数据传送到服务器端，然后服务器端程序验证。

表单包含内容：表单控件   提示信息   表单域

 

form标签用于定义表单域：       <  form  method = " post / get "   action = “ ...”>

                                                   </form>

 

表单控件的属性：

type   /    name  /   value   /  size : input的宽度   / checked : 默认选中   /   maxlength： 允许输入的最多字符数

表单控件的属性（type）值：

text：                      文本输入框     <input type="text"  name=" "  value=" " />

password：             密码输入框     <input type="password"  name=" " value=" " />

radio/checkbox：    单选框、复选框  <input   type="radio/checkbox"    name=""   checked="checked/"/>    // checked默认选中

                                 //radio 为一组时，name必须相同。

button  ：                普通按钮          <input type="button"  name=" " value=" 确定" />

submit/reset ：        提交按钮、重置按钮  <input type="submit/reset" value="提交/重置">

image ：                  图像形式提交   <input type=" image "  name=" "  value=" " />

file  ：                     文件形式           <input type=" file "  name=" "  value=" " />

 

其他标签：

文本域    :           <textarea  rows="行数" cols="列数">文本</textarea>

下拉列表框：   <select  multiple="multiple">                                                                    //multiple可以多选
                            <option  value =" 提交值" > 选项  </ option>
                           <option  value =" 向服务器提交的值"   selected="selected"> 显示的值</ option>      //selected 默认选中
                       </select>

label标签

用于绑定一个表单标签。当用户点击该label标签时，被绑定的元素会自动获得 输入焦点。

用法：<label for="password">

      用户名: <input type="text" > 

      密 码: <input type="password" id="password"> 

        </label>

注意：标签的 for 属性中的值应当与相关控件的 id 属性值一定要相同。被绑定的元素可以不在lable标签内。

 

---

新增属性（常见）：

placeholder :占位符，提示语。                   用法：< input type="text"  plaeholder="请输入用户名" >

autofocus  ：页面加载时自动获得焦点       用法：< input type="text"   autofocus >

multiple      :多文件上传                               用法：< input type="file"   multiple >

required     :必填项                                      用法：< input type="text"   required >

autocomplete：表单自动完成功能             autocpmplete="on / off"    1.表单必须提交  2.必须命名

accesskey  ：规定激活元素的快捷键       <.input type=”text“   accesskey=" a" >    输入a ，光标自动聚焦到输入框

  

新增 input 属性值（11个）：

       tel   /  email  /   url   /  number  / search  /  range（拖动条） / time（时分） /  date （年月日）/  datetime（时间）

       month  /  week（年-周）