思路:
- 静态或动态生成所有输入框,并隐藏
- 选中多选框后,让其显示
- 每一次点击都要进行一次遍历,对勾选或取消勾选的多选框对应的输入框进行显示和隐藏
(多选框与输入框)
//渲染及隐藏被选中的查询多选框对应的输入框
function Querychecked() {
$('input[type="checkbox"]').click(function() {
if (this.checked) {
let that = $(this);
//输入框的类名
$(".control-label").each(function() {
//判断 输入框的label 与 选中多选框的内容 是否相同
if ($(this).text() == that.val()) {
//委托输入框的父亲显示出来
$(this).parent().show(0,function(){
})
}
})
}
//需要else,没有选中需要隐藏
else {
let that = $(this);
// console.log(that)
console.log($(this).val());
$(".control-label").each(function() {
if ($(this).text() == that.val()) {
$(this).parent().hide(0,function(){
})
}
})
}
})
}