控件 controller
什么是控件？
控件定义了用户与页面之间的交互方式
name 属性
<input type="text" name="login_name" />
<input type="radio" name="radioTest" checked="checked"/>
<input type="radio" name="radioTest" />
<input type="radio" name="radioTest" />
<input type="checkbox" name="checkboxTest" checked="checked" />
<input type="checkbox" name="checkboxTest" />
<input type="checkbox" name="checkboxTest" checked="checked"/
- 控件必须要有name属性,因为服务端脚本将根据name属性来读取控件的值
- 对于单选或多选控件而言,相同的name标记着它们属于同一组,从而具有单选或多选的输入特征
控件标签标记 <label>
<label>标记用于说明控件的含义,通常与控件结对出现,对于非视觉用户尤其有意义
<label for="login_name">姓名 </label>
<input type="text" name="login_name" id="login_name">
可以简单的认为:控件的name属性是一个后端属性,而id属性才是一个前端属性
控件提示属性 place holder
Export
HTML
Result
Placeholder 是 HTML5 新增的一个表单标签属性，当 input 或者 textarea 设置了该属性后，该属性的值将作为灰字提示显示在文本框中，当文本框获得焦点（或输入内容）时，提示文字自动消失。
占位符可以补充<label>标记的作用,提供输入的示例,更好的提示用户.
数据校验
HTML5 提供为 pattern,require等 属性支持在浏览器端对输入的数据进行校验,譬如注册表单要求用户必须输入合法的email地址,则可以通过下例实现:
<input type="text" name="email" pattern="/^[a-zA-Z0-9.!#$%&’*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/" required />
也可以直接通过 HTML5 提供的新控件类型
<input type="email" name="email" required >
基于浏览器的客户端校验并不可靠,对于敏感的数据,仍然需要在服务端脚本中再次进行校验