场景:表单生成后,通过checkbox对相应元素进行操作(如显示密码)。
代码段:
<td >{$items['title']}</td>
<td >{$items['account']}</td>
<td style="width: 30%;">
<label class="form-check form-switch" >
<input class="form-check-input" type="checkbox" value="{$items['id']}" onclick="checkboxOnclick(this)">
<span class="form-check-label" id="pA{$items['id']}" style="">******</span>
<span class="form-check-label" id="pB{$items['id']}" style="display: none;">{$items['password']}</span>
</label>
</td>
要点:用当前数据的id对当前checkbox赋值:value="{$items['id']}",且绑定事件:οnclick="checkboxOnclick(this)";同理假密码:id="pA{$items['id']}";同理真密码:id="pB{$items['id']}"。
function checkboxOnclick(checkbox){
var id = checkbox.value;
var pA ="pA"+id;
var pB ="pB"+id;
if ( checkbox.checked == true){
$("#"+pA).css('display','none');
$("#"+pB).css('display','');
}else{
$("#"+pA).css('display','');
$("#"+pB).css('display','none');
}
}
要点:点击时,通过checkbox的value拼接出真假密码的id值,通过当前checkbox的true或false来操作显示选密码。