87,910
社区成员
发帖
与我相关
我的任务
分享jQuery 高分求助
1,2,3是多选框，勾选1的时候所有input都可输入，勾选2的时候input1，input3，input5可输入，勾选3的时候input3，input4可输入，多选的时候取最大：
如勾选2和3的时候input1，input3，input4，input5都可输入。
勾选1和2或1和3的时候所有input都可输入。请上jQuery代码，谢谢。
如勾选2和3的时候input1，input3，input4，input5都可输入。
勾选1和2或1和3的时候所有input都可输入。请上jQuery代码，谢谢。
<div class="row">
<div class="col-md-12 order-md-1">
<div class="row">
<div class="col-md-3 mb-3">
<div class="checkbox">
<label>
<input type="checkbox" class="checkbox" id="checkbox1" value="1" name="account[]"> 1
</label>
</div>
</div>
<div class="col-md-3 mb-3">
<div class="checkbox">
<label>
<input type="checkbox" class="checkbox" id="checkbox2" value="2" name="account[]">2
</label>
</div>
</div>
<div class="col-md-3 mb-3">
<div class="checkbox">
<label>
<input type="checkbox" class="checkbox" id="checkbox3" value="3" name="account[]">3
</label>
</div>
</div>
</div>
<br />
<br />
<div class="row">
<div class="col-md-6 mb-3">
<div class="form-group">
<label for="eName">input1</label>
<input type="text" class="form-control" name="input1" id="input1">
</div>
</div>
<div class="col-md-6 mb-3">
<div class="form-group">
<label for="input2">input2</label>
<input type="text" class="form-control" name="input2<" id="input2">
</div>
</div>
</div>
<div class="row">
<div class="col-md-4 mb-3">
<div class="form-group">
<label for="input3">input3</label>
<input type="text" class="form-control" name="input3" id="input3">
</div>
</div>
<div class="col-md-4 mb-3">
<div class="form-group">
<label for="input4">input4</label>
<input type="text" class="form-control" name="input4" id="input4">
</div>
</div>
<div class="col-md-4 mb-3">
<div class="form-group">
<label for="input5">input5</label>
<input type="text" class="form-control" name="input5" id="input5">
</div>
</div>
</div>
</div>
...全文
请发表友善的回复…
发表回复
初心不变时过迁 2020-09-14
- 打赏
- 举报
膜拜大佬
聂顺顺 2020-09-11
- 打赏
- 举报
周一上班我试下，谢谢
天际的海浪 2020-09-11
- 打赏
- 举报
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript" src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
</head>
<body>
<script type="text/javascript">
$(function(){
$("input[name='account[]']").change(function(event){
var obj = {};
if ($("#checkbox1").prop("checked")) {
obj[1] = obj[2] = obj[3] = obj[4] = obj[5] = true;
}
if ($("#checkbox2").prop("checked")) {
obj[1] = obj[3] = obj[5] = true;
}
if ($("#checkbox3").prop("checked")) {
obj[3] = obj[4] = true;
}
for (var i = 1; i <= 5; i++) {
$("#input"+i).prop("disabled",!obj[i]);
}
});
});
</script>
<div class="row">
<div class="col-md-12 order-md-1">
<div class="row">
<div class="col-md-3 mb-3">
<div class="checkbox">
<label>
<input type="checkbox" class="checkbox" id="checkbox1" value="1" name="account[]">1
</label>
</div>
</div>
<div class="col-md-3 mb-3">
<div class="checkbox">
<label>
<input type="checkbox" class="checkbox" id="checkbox2" value="2" name="account[]">2
</label>
</div>
</div>
<div class="col-md-3 mb-3">
<div class="checkbox">
<label>
<input type="checkbox" class="checkbox" id="checkbox3" value="3" name="account[]">3
</label>
</div>
</div>
</div>
<br />
<br />
<div class="row">
<div class="col-md-6 mb-3">
<div class="form-group">
<label for="eName">input1</label>
<input type="text" class="form-control" disabled name="input1" id="input1">
</div>
</div>
<div class="col-md-6 mb-3">
<div class="form-group">
<label for="input2">input2</label>
<input type="text" class="form-control" disabled name="input2" id="input2">
</div>
</div>
</div>
<div class="row">
<div class="col-md-4 mb-3">
<div class="form-group">
<label for="input3">input3</label>
<input type="text" class="form-control" disabled name="input3" id="input3">
</div>
</div>
<div class="col-md-4 mb-3">
<div class="form-group">
<label for="input4">input4</label>
<input type="text" class="form-control" disabled name="input4" id="input4">
</div>
</div>
<div class="col-md-4 mb-3">
<div class="form-group">
<label for="input5">input5</label>
<input type="text" class="form-control" disabled name="input5" id="input5">
</div>
</div>
</div>
</div>
</body>
</html>
