一、前情回顾
在编辑前端页面时,希望的效果是:点击文字,文字对应的checkbox小框框就会自动勾选,就不用每次都要对着小方格点。radio单选框也想要同样的效果。
二、解决方案
(1)checkbox 多选框
在 input 外加个 label 标签,将for属性设置的和 input 里的id值一样即可,如下:
<div class="easyui-linkbutton">
<label style="height: 20; font-size: 11px" for="selectOnly"><input type="checkbox" id="selectOnly" /> 
只操作选中报表
</label>
</div>
或者
<div class="easyui-linkbutton">
<input type="checkbox" id="selectOnly" /> 
<label style="height: 20; font-size: 11px" for="selectOnly">
只操作选中报表
</label>
</div>
注意:1、说明文字标签必须使用 label ;
2、for属性指定需要联动 checkbox 的 id 。
(2)radio 单选框
radio单选框比较简单,只需要在外边加上 <label></label> 标签即可。
<div>
<label>
<input type="radio" id="allSelect" name="select" value="allSelect"/> 全选
</label>
<label>
<input type="radio" id="selected" name="select" value="selected"/> 已选
</label>
<label>
<input type="radio" id="noSelect" name="select" value="noSelect"/> 不选
</label>
<label>
<input type="radio" id="waitSelect" name="select" value="noSelect" checked="checked"/> 未选
</label>
</div>