点击 label 绑定给其他元素,用以提高用户体验。
- 显式绑定，用 id 联系
<label for="user_name">Name: </label>
<input id="user_name" type="text">
- 隐式绑定，嵌套即可
<label for="">Name: <input type="text"></label>
应用场景：
- checkbox 记住密码/用户协议
<input type="checkbox" id="remember">
<label for="remember">记住密码？</label>
var oRem = document.getElementById("remember");
oRem.onclick = function(){
if(this.checked){
//点击 label 触发input事件
}
};
- 绑定 button ，触发 click
<label for="btn">some text</label>
<butto id="btn">button</button>
var oBtn = document.getElementById("btn");
oBtn.onclick = function(){
//点击 label 触发 button 事件
};
- 配合 Css 模拟开关效果/checkbox和radio等等...
